Using template in ASP.net AJAX4.0

Source: Internet
Author: User

In the context of using the Jtemplate plugin, we shared the flexibility of the Jtemplate plug-in, which certainly gave us a lot of convenience to provide better UX (User experience) in an era when the JSON performance was particularly popular and widely supported. Similar features are available in ASP.net Ajax (currently PREIVEW3) 4.0, and today we'll look at how to use asp.net Ajax 4.0 Template.

Introducing Ajax class libraries and related namespaces

To use ASP.net AJAX 4.0 you must first obtain a 4.0 JS class library. You can get it on the CodePlex: Http://www.codeplex.com/aspnet/Wiki/View.aspx?title=AJAX&referringTitle=Home. AJAX4.0 provides client support, data templates, data sources and Data View controls for the Ado.net data service, as well as data binding and other features. There are two JS files in the Downloaded class library: Microsoftajaxtemplates.js and Microsoftajaxadonet.js. It is referenced first to the paging file, and the related namespaces need to be imported in order to use the DataView and template features:

<body
  xmlns:sys="javascript:Sys"
  xmlns:dv="javascript:Sys.UI.DataView"
  sys:activate="*">
  <form id="form1" runat="server">
  <asp:ScriptManager ID="manager1" runat="server">
    <Scripts>
      <asp:ScriptReference Path="~/Library/MicrosoftAjaxAdoNet.js" />
      <asp:ScriptReference Path="~/Library/MicrosoftAjaxTemplates.js" />
    </Scripts>
</asp:ScriptManager>
</body>

Here I have introduced the Sys namespace and the Sys.UI.DataView namespace. Because this is the namespace in which the related controls reside in the JS class library. Sys:activate indicates that the element that owns the SYS:ATACTH tag will be activated in the current document, so that it will take effect when the template is attached to the DataView. * Indicates that all elements are activated.

Define a simple template and build

OK, next we'll define a simple template and bind the data source by consuming the ado.net. Note that a well-defined template must have a sys:attach= "DV" attribute, indicating that the template is valid for DataView space and that the Ajax class library is associated during initialization. If Sys:attach is not declared, a null reference error is generated when the Set_data () method is executed.

<div>
 <ul id="customerListView" class="sys-template" sys:attach="dv">
  <li>{{ CompanyName }}</li>
 </ul>
</div>

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.