This is a short article describing how you can invoke and pass values to a javascript function from a WebBrowser component using Windows Forms. In this article, we will navigate to a HTML page using the WebBrowser component and pass values to the javascript function kept inside the page, using Windows Forms. Let us see the steps required to do so:
Step 1: Open Visual Studio > File > New > Project. In the Project Types pane, choose the language of your choice (Visual C# or Visual Basic). In the Templates pane, choose Windows Application. Choose a name and location for the project and click OK.
Step 2: Drag and drop a button(btnBrowse) and a WebBrowser(webBrowser1) component to the form. Set the ‘Dock’ property of the WebBrowser component to ‘Bottom’.
Step 3: Now create a HTML page that will contain the javascript function. I have created this page on my D:\ and named it TestPage.html. The html after adding the javascript function will look similar to the following:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Calling javascript</title>
<script type="text/javascript" language="javascript">
function DisplayName(name)
{
this.lbl1.document.writeln("Welcome " + name);
}
</script>
</head>
<body>
<div>
<label id="lbl1"></label>
</div>
</body>
</html>
We will be calling the function ‘DisplayName’ and pass a value to this function from our WebBrowser component.
Step 4: Create an event handler for the WebBrowser_DocumentCompleted event. We will be calling the javascript using the Document.InvokeScript method. This method executes a scripting function defined in an html page.
C#
private void webBrowser1_DocumentCompleted(object sender, WebBrowserDocumentCompletedEventArgs e)
{
if (e.Url.Equals(webBrowser1.Url))
webBrowser1.Document.InvokeScript("DisplayName", new object[] {"dotnetcurry"});
}
VB.NET
Private Sub webBrowser1_DocumentCompleted(ByVal sender As Object, ByVal e As WebBrowserDocumentCompletedEventArgs)
If e.Url.Equals(webBrowser1.Url) Then
webBrowser1.Document.InvokeScript("DisplayName", New Object() {"dotnetcurry"})
End If
End Sub
Step 5: The final step is to navigate to the page on the button click:
C#
private void btnBrowse_Click(object sender, EventArgs e)
{
webBrowser1.Navigate("file://D:/TestPage.html");
}
VB.NET
Private Sub btnBrowse_Click(ByVal sender As Object, ByVal e As EventArgs)
webBrowser1.Navigate("file://D:/TestPage.html")
End Sub