How to capture button click event of webpage (opened inside WebBrowser Control) in WPF form?

Question

Consider a scenario where I have a WebBrowser Control in WPF application. A web page is loaded inside WebBrowser Control. The web page contains a button. The web page is of ASP.NET application.

I want to capture the button click event of the webpage into WPF Form (which hosts WebBrowser Control). Is there any way to achieve this functionality?

Willumsen

Answer 1

Here is code that should do exactly what you want with comments to explain what is going on:

public partial class MainWindow : Window
{

    /// <summary>
    /// This is a helper class.  It appears that we can't mark the Window as ComVisible
    /// so instead, we'll use this seperate class to be the C# code that gets called.
    /// </summary>
    [ComVisible(true)]
    public class ComVisibleObjectForScripting
    {
        public MainWindow Parent;

        public void ButtonClicked()
        {
            //Do whatever you need to do.  For now, we'll just show a message box
            Parent.MessageBox.Show("Button was clicked in web page");
        }
    }

    public MainWindow()
    {
        InitializeComponent();
        //Pass an instance of our helper class as the target object for scripting
        webBrowser1.ObjectForScripting = new ComVisibleObjectForScripting{ Parent = this };
    }

    private void Window_Loaded(object sender, RoutedEventArgs e)
    {
        //Navigate to your page somehow
        webBrowser1.Navigate("http://www.somewhere.com/");
    }

    private void webBrowser1_LoadCompleted(object sender, NavigationEventArgs e)
    {
        //Once the document is loaded, we need to inject some custom JavaScript.

        //Here is the JavaScript
        var javascript = @"
//This is the JavaScript method that will forward the click to the WPF app
function htmlButtonClicked()
{
    //Do any other procession...here we just always call to the WPF app
    window.external.ButtonClicked();
}

//Find the button that you want to watch for clicks 
var searchButton = document.getElementById('theButton');

//Attach an onclick handler that executes our function
searchButton.attachEvent('onclick',htmlButtonClicked);
";

        //Grab the current document and cast it to a type we can use
        //NOTE: This interface is defined in the MSHTML COM Component
        //       You need to add a Reference to it in the Add References window
        var doc = (IHTMLDocument2)webBrowser1.Document;
        
        //Once we have the document, execute our JavaScript in it
        doc.parentWindow.execScript(javascript);
    }
}

Some of this was taken from http://beensoft.blogspot.com/2010/03/two-way-interaction-with-javascript-in.html

Intercrop

I keep getting an exception thrown: HRESULT 0x80020101. – Wyon

@Wyon Late reply, but I get that when there's some syntax error in the JS. The engine is pretty old and doesn't have the conveniences of let/const or newer. – Royroyal