MSDN Magazine - November 2008 - (Page 35)

existing front end to Silverlight, you may run into situations where a synchronous call would save you a lot of redesign. I’m the first to say that design is key, but if a consciously written synchronous call can save me hours or days of work, I’ll definitely go for it.) That said, the Silverlight team has good reasons to push the asynconly approach because synchronous calls to remote endpoints could likely cause Silverlight applications to freeze the user interface, thus deteriorating the end user’s experience with his browser and Web applications. Synchronous calls are technically possible, but the team does not support this natively in the platform in the interest of all applications and their consumers. Likewise, the team does not recommend resorting to a manually written synchronous remote call using XmlHttpRequest, as in Figure 5. Figure 5 shows how to use XmlHttpRequest to set up a synchronous same-domain call to a URL from within Silverlight 2. The key statement is when you invoke the open method on XmlHttpRequest. The Boolean argument indicates whether the call has to be asynchronous. If false, you instruct the object to proceed in a synchronous manner. The drawback of this trick is that it leverages a low-level tool that just doesn’t offer any facilities for converting strings to and from, say, JavaScript Object Notation (JSON) streams. If you employ this trick, you have to take care of any JSON serialization and deserialization using the DataContractJsonSerializer class. JavaScript functions can gain access to the content of the Silverlight application and perform read and write operations. The content of the Silverlight application is the tree of XAML elements. Anything in the XAML document that is characterized by a unique name—the x:Name attribute—can be accessed and scripted in JavaScript. The first step entails getting a DOM reference to the Silverlight plug-in. In an ASP.NET AJAX page, you would use the following code: var plugin = $get("SilverlightControl1"); Figure 5 Making Synchronous Calls from within Silverlight 2 private void Button1_Click(object sender, System.Windows.RoutedEventArgs e) { string url = " "; ScriptObject xhr = HtmlPage.Window.CreateInstance("XMLHttpRequest"); xhr.Invoke("open", "POST", url, false); xhr.Invoke("setRequestHeader", "Content-Type", "application/x-www-form-urlencoded"); // Prepare the body as the endpoint expects it to be string body = " "; xhr.Invoke("send", body); string response = (string) xhr.GetProperty("responseText"); // Process the response and update the UI ProcessData(response) } content to display, then it is hard to imagine any changes that you might want to make to the user interface using JavaScript instead of managed code. In Silverlight 2, you can use JavaScript code to invoke managed code. This option addresses a scenario where you have an HTML- XAML, Managed Code, and JavaScript In Silverlight 2 you can use JavaScript code to invoke managed code. based page powered by some managed code that performs critical operations. Your JavaScript code can script any managed object hosted in Silverlight 2 that has been previously registered as scriptable: guidHelper = new GuidHelper(); HtmlPage.RegisterScriptableObject("GuidTools", guidHelper); SilverlightControl1 is the ID of the Silverlight control or the ID you used for the tag that points to the downloadable content. Next, you point to the actual XAML content using the content property. To locate specific XAML elements, you use the findName method: // Retrieve the XAML element tagged with the name of TextBlock1 var xamlTree = $get("SilverlightControl1").content; var textBlock1 = xamlTree.findName("TextBlock1"); // Modify the current content of the text block element textBlock1.Text = " "; The method RegisterScriptableObject takes the informal name of the object being registered and a variable instance. The string being the first argument is the name that the caller JavaScript code will use to refer to the registered object. With respect to the preceding code, the following shows what you do from JavaScript in order to invoke a method on the sample class GuidHelper: // Invoke a method on a scriptable managed object var guid = $get("Silverlight1").content.GuidTools.Generate(); // Update the user interface with the results $get("Random1").innerHTML = guid; If you use JavaScript code to drive the content of the XAML document, then it is recommended that you cache in your page any reference to XAML elements that you encounter along the way. This would save you from repeatedly traversing the XAML tree to find the same element over and over again. You should notice that using JavaScript to access the content of the XAML document is a bit outdated for Silverlight 2. It remains a good option if you are targeting Silverlight 1.0 or, at least, if you are serving up Silverlight applications consisting of only XAML and script code. If you can use managed code to decide about the msdnmagazine.com The public name of the scriptable object—in this case, GuidTools—is used as a member to access the underlying object from JavaScript. The pseudo property, GuidTools, is exposed by the content property of the Silverlight plug-in. Let’s have a look at the GuidHelper class: public class GuidHelper { [ScriptableMember] public string Generate() { Guid g = Guid.NewGuid(); November 2008 35 http://www.msdnmagazine.com

Table of Contents Feed for the Digital Edition of MSDN Magazine - November 2008

Contents MSDN Magazine - November 2008 Toolbox CLR Inside Out Data Points Cutting Edge Security Briefs Test Your Security IQ Agile SDL Access Control Utility Spotlight RIA Test Run Wicked Code Foundations Team System End Bracket

MSDN Magazine - November 2008

For optimal viewing of this digital publication, please enable JavaScript and then refresh the page. If you would like to try to load the digital publication without using Flash Player detection, please click here.