Saturday, December 29, 2007
Saturday, December 8, 2007
Create Rich Web Apps with AJAX
Assume you want to create a Web service named MathService that exposes a Web Method named Add():
[ScriptService] [WebService(Namespace = "http://www.interfacett.com/")] [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)] public class MathService : WebService { [WebMethod] public int Add(int x, int y) { return x + y; } }You AJAX-enable the Web service's class by applying the ScriptServiceAttribute class directly to it as shown. No other changes are required at the Web service level for AJAX-enabled applications to call it. Other classes such as ScriptMethodAttribute and GenerateTypeAttribute can also be used in a Web service although they're not required. More information about these attributes can be found here. Web services called by ASP.NET AJAX-enabled pages must be in the same domain as the page where the call originates from. This is due to security restrictions built into the XmlHttpRequest object used to make Web service requests. Although you can't call external Web services directly using ASP.NET AJAX, you can still make calls to external Web services by creating a local Web service that acts as the middleman. For example, assume you want to create a Web service that calls an Amazon.com service to retrieve book information (see Listing 2). This Web service relies on a class named AmazonSearch to call the Amazon.com service through a Web service proxy object and retrieve the desired data. You can find the Web Service Description Language (WSDL) document that describes the Amazon.com Web service here, and you can sign up for a free access account here. Amazon.com provides a free Web service called Amazon e-Commerce Service that you can use to retrieve information about books, DVDs, albums, and many other items sold on the Amazon.com Web site. By using the service, you can display Amazon.com products on your Web site and even receive a portion of sale proceeds for items purchased from your site. The service can be accessed for free once you've registered (registration is also free) and received an access key. The Amazon.com e-Commerce Service supports the latest standards and the team supporting the service provides samples that demonstrate calling the service in multiple languages, as well as a forum for posting questions about the service. You might wonder why I chose to use a Web service from a commercial vendor, such as Amazon, because this goes against the grain of VSM's usual approach. The reason: I wanted to show you a real-world implementation in action, as opposed to an example more theoretical than practical, and few non-commercial examples exist that have the robustness of Amazon's approach. Plus, it's free, and the terms of use are reasonable. ASP.NET AJAX provides a simple and efficient mechanism for calling Web services that have been marked with the ScriptServiceAttribute class. You can't right-click on your Web site project in Visual Studio .NET 2005 and add a Web Reference to create a Web service proxy, but you can use ASP.NET AJAX's ScriptManager control to create a client-side proxy that handles calling the service and passing JSON messages. You accomplish this using the ScriptManager's Services property and the ServiceReference control:
<asp:ScriptManager ID="smp" runat="server"> <Services> <asp:ServiceReference Path="AmazonService.asmx" /> </Services> <Scripts> <asp:ScriptReference Path="Scripts/Amazon.js" /> </Scripts> </asp:ScriptManager>Defining a service reference on the ScriptManager control causes a client-side proxy class to be generated and added to the page at runtime. This proxy code looks something like this:
<script src="AmazonService.asmx/js" type="text/javascript"></script>Note that the ASMX file is called directly and that "js" is added to the end of the path. The service is marked with the ScriptService attribute, so the ASP.NET AJAX runtime generates the JavaScript proxy code needed to call the service automatically. To call a Web service using a client-side proxy object, you reference the service's namespace, class, and method name using JavaScript. Parameter data required by the Web service's Web Method is passed to the method along with the name of the callback method. All calls to Web services are made asynchronously, and the callback method is invoked when a Web service call returns data to the browser. When the page containing the client-side Web service proxy first loads, it calls the SearchBooks() method (see Listing 3). This method locates a div tag with an ID of divAmazon and assigns a value of "Loading Books" to its innerHTML property. It then calls the local AmazonService.asmx service by referencing the service's namespace (GolfClubShack), class (AmazonService), and Web Method name (GetBooks). The GetBooks() method accepts three parameters, including the book text to search, the data results page to grab, and the name of the callback method. In this example a callback named OnWSCallback() is defined. Data returned from the Web service is routed automatically to the OnWSCallback() method, which processes the data (see Figure 1). The method iterates through all of the books returned and accesses different properties of each book, such as ImageUrl, Title, and Price. Note that you access each property in a strongly typed manner, much as you would when writing server-side code using C# or VB.NET. This strongly typed access to object property data is made possible by the proxy code generated by the ScriptManager. In addition to shipping the ASP.NET AJAX Extensions, Microsoft has also released a separate download called the ASP.NET AJAX Toolkit (also available here). This toolkit contains more than 30 AJAX-enabled controls for performing a variety of tasks. One of the controls that ties in nicely to Web services is the AutoCompleteExtender control. You've probably seen such a control if you've visited the Google suggest site or have the Google search box embedded in your browser. You can use this control to provide suggestions to end users as they type into a textbox. The control works by reading characters typed into a textbox and passing them to a Web service. The Web service performs a lookup against a data source to find data items that match with the initial characters typed and passes the matching items back to the AutoCompleteExtender control. The control then shows the matching data items directly below the textbox so that users can select them (see Figure 2). Using the AutoCompleteExtender requires that you copy the AjaxControlToolkit.dll assembly into your Web site's bin directory. This assembly is available in the ASP.NET AJAX Toolkit. You need to reference the AjaxControlToolkit.dll assembly once the assembly is available to use. Do this in web.config or in the page where you want to use the AutoCompleteExtender control. Add this code to the web.config file's <system.web> begin and end tags to reference the assembly in web.config and make it available for all pages on a Web site:
<pages> <controls> <add tagPrefix="toolkit" namespace="AjaxControlToolkit" assembly="AjaxControlToolkit" /> </controls> </pages>Add this code to the top of a page to reference the assembly in a specific page:
<%@ Register TagPrefix="toolkit" Namespace="AjaxControlToolkit" Assembly="AjaxControlToolkit" %>After you reference the assembly, you can define the AutoCompleteExtender in the target page. The control boasts several key properties, including the target control ID to extend the textbox with auto-complete behavior, the minimum number of characters to accept in the target control before calling the Web service, and the name of the Web service and Web Method that will be called to look up data items. This code defines an AutoCompleteExtender control that extends a TextBox with an ID of txtSearch:
<toolkit:AutoCompleteExtender id="ac" runat="server" ServicePath="~/AutoCompleteService.asmx" ServiceMethod="GetSearchItems" TargetControlID="txtSearch" EnableCaching="true" MinimumPrefixLength="2" />Once the number of characters to watch for has been reached (as defined using the AutoCompleteExtender's MinimumPrefixLength property), the Web service defined on the control is called to look for matching data items. For example, this Web service handles searching for matching data items and returning them to the AutoCompleteExtender control to display on the page (see Listing 4). The GetSearchItems() Web Method accepts two parameters: prefixText and count. The prefixText parameter contains the characters typed by the end user, while the count parameter contains the number of matching items to return back to the AutoCompleteExtender control. Data items that start with the value supplied by the prefixText parameter are returned from the Web Method in a string array. The ASP.NET AJAX Extensions provide several different ways to retrieve data from a back-end server using AJAX technologies. Although the UpdatePanel control will be all that's needed in many situations, integrating Web services into your Web applications can result in smaller request and response messages, which can lead to faster load times. By leveraging Web services you can also process and format data directly on the client rather than on the server. Web services can also be used to aid users as they type into textboxes by using controls such as the AutoCompleteExtender control found in the ASP.NET AJAX Toolkit. Source
ASP.NET C# - Enter Key
ASP.NET 2.0 makes this problems easier and introduce a concept of a "default button". New defaultbutton attribute can be used with <form> or <asp:panel> control. What button will be "clicked" depends of where acutally cursor is and what button is choosen as a default button for form or a panel.
Here is sample HTML code that contains one form and one panel control:
<form defaultbutton="button1" runat="server">
<asp:textbox id="textbox1" runat="server"/>
<asp:textbox id="textbox2" runat="server"/>
<asp:button id="button1" text="Button1" runat="server"/>
<asp:panel defaultbutton="button2" runat="server">
<asp:textbox id="textbox3" runat="server"/>
<asp:button id="button2" runat="server"/>
</asp:panel>
</form>
Saturday, December 1, 2007
Linux: Tips for new Ubuntu installation
Installing libdvdcss2 and w32 video codecs in Ubuntu Gutsy Gibbon
Support for WMV, RealMedia and other formats has been bundled into the w32codecs package. This package is not available from the Ubuntu repositories due to licensing and legal restrictions.
For Ubuntu Gutsy Gibbon Users run the following command
sudo wget http://www.medibuntu.org/sources.list.d/gutsy.list -O /etc/apt/sources.list.d/medibuntu.list
Now you need to copy the key using the following command
wget -q http://packages.medibuntu.org/medibuntu-key.gpg -O-¦ sudo apt-key add -
Update the source list using the following command
sudo apt-get update
Install Codecs using the following command
sudo apt-get install w32codecs libdvdcss2
Using above download locations you can install most of the mutimedia codecs for ubuntu.
sudo apt-get update
Mplayer Plugin for Firefox
If you want to install Mplayer with plug-in for Mozilla Firefox run the following command
sudo apt-get install mozilla-mplayer