Oct 26

One of the cool features MS AJAX preview 6 introduces is better JQuery integration. From now on, MS AJAX components (which have been defined through a script info object registered through a defineScript(s) method call) are exposed as jQuery plugins. This means that you can write something like this:

<head runat="server">
  <style type="text/css">
  <script src="Scripts/MicrosoftAjax/start.debug.js" 
script> <script type="text/javascript"> Sys.require([Sys.components.dataView,
Sys.scripts.jQuery]); var items = [ { name: "luis", address: "fx" }, { name: "john", address: "lx" }, { name: "rita", address: "fx" } ]; Sys.onReady(function () { $("#myDv").dataView({
data: items,
itemTemplate: "#template" }) .css("background-color", "lightgray"); }); </script> </head> <body> <div id="myDv"> </div> <div id="template" class="sys-template"> <div>{{name}}</div> </div> </body>

Pretty cool, right? Instead of using the traditional MS AJAX Sys.create helper methods, we’re using a JQuery object for wrapping the div so that we can attach it to a MS AJAX DataView control and set its background color.

Notice that the dataView method (added to the jQuery.fn object) is built on the fly when the JQuery script is listed on the depedencies list passed to the Sys.require method. This is one of those small details that makes life better for everyone…Stay tuned for more.

9 comments so far

  1. Dave Reed
    12:17 pm - 10-26-2009

    You can also just include jquery the way you normally do, FYI.

  2. Dave Reed
    12:17 pm - 10-26-2009

    You can also just include jquery the way you normally do, FYI.

  3. luisabreu
    12:21 pm - 10-26-2009

    Yes, but I”m really lazy and Sys.require seems to require few key pushes…

  4. Dave Reed
    1:08 pm - 10-26-2009

    Yup — some people will probably prefer to do it the usual way, just wanted to point out it isn”t a requirement that you load jquery through the loader. It plays nice.

    This gives you a pretty easy way to load jquery dynamically along with your own scripts, fyi.. so start.js can be useful to you even if you don”t use the ms ajax framework proper.

  5. luisabreu
    1:24 pm - 10-26-2009


  6. william apken
    2:17 pm - 10-26-2009

    If you are planning to implement the dataview as a component that contains several controls, ie. a dataGrid.

    by not using like Dave said the proper framework. Do we lose the ability to dispose of the component and all controls, behaviors and handlers that are contained with the component? or even they ability .find() the component?

    can you still do:

    myDV = $(“#myDv”).dataView({
    data: items,
    itemTemplate: “#template” })
    .css(“background-color”, “lightgray”);

  7. luisabreu
    3:18 pm - 10-26-2009

    I think that what Dave was saying is that even if you don”t want to use MS AJAX components, you can rely on start.js file for having on-demand loading of the script files you”re using.