In an earlier post I described how you can call jQuery from within a Silverlight application. The process is rather simple as was the example. Please refer to the original post for further details.

Afterwards I began to think about calling more complex jQuery constructs from within Silverlight. What about registering events and using anonymous functions? At first glance it didn’t seem it was going to work at least not with the technique I described in my earlier post. Then I discovered the dark side of Javascript the Eval function. The Silverlight HtmlPage.Window object exposes the Eval function that allows you to evaluate any string.

I added the following line of code to my the Page constructor for the example from my previous post.

This code basically registers a click event with the DOM element with id of #hello. When the DOM element is clicked an alert is displayed and it works perfectly well.

As with raw Javascript all the pros and cons with the use of Eval exist when used from within Silverlight. But it’s good to know that if required complex Javascript functionality can be implemented from within Silverlight.

Last night I gave a jQuery presentation at TVBUG and I was asked whether you could call the jQuery API directly from within Silverlight. My initial response was yes, but I had promise the person that I would create a demo and blog about it.

Calling Javascript from within Silverlight control involves the following steps;

1. Add a using System.Windows.Browser namespace to the code behind of the Silverlight control.
2. Creating a ScriptObject by calling HtmlPage.Window.CreateInstance.
3. Calling the Invoke method off the ScriptObject from step 2.

Let’s look at some code.

The listing below contains a code snippet that is run when a Silverlight button is clicked.

Notice the parameters to the HtmlPage.Window.CreateInstance static member shown on line 25 contains the call to jQuery function $() and the selector #hello. This call returns a ScriptObject and can subsequently be used to invoke functions off the jQuery object. In this example, I am first setting the background of the DOM element with id of hello to red and then setting it’s border.

I have a working demo of this just navigate to this site.  

I had one of two options, drink green beer on St. Patrick's Day or give a JQuery presentation a TVBUG. Silly me I chose to give the presentation. All kidding aside, today, I had the privilege to speak at the Toronto Visual Basic User's Group. I decided to give the talk a St. Patrick’s theme and provided green food colouring for the water. I also gave the talk while wearing a St. Patrick’s hat.

The topic was on jQuery a technology that I have embraced for the last few months. As ASP.NET developers we need to upgrade our skill sets and be able to provide rich internet applications. jQuery is one such technology that delivers Web 2.0 type functionality. The audience was quite engaged and at the end of the presentation I got some very positive feedback and interest in jQuery. If you want to see the presentation online then visit the site. 

Here are some photos from the meeting.