Use Ajax and data island to achieve no flush binding _ practical skills

The first thing we need to use today is Ajax.NET Professional, where you can get information about ajax.net from http://www.schwarz-interactive.de/. Second, you need to know the relevant knowledge of XML data island.
Let's take a look at a simple binding example:
The first step is to first determine the XML data source

<xml id= "XmlData" name= "XmlData" >
<root>
<METADATA>
<author>john smith</author>
<generator>visual notepad</generator>
<PAGETYPE>Reference</PAGETYPE>
<abstract>specifies a data island</abstract>
</METADATA>
<METADATA>
<author>john smith2</author>
<generator>visual notepad2</generator>
<PAGETYPE>Reference2</PAGETYPE>
<abstract>specifies a data island2</abstract>
</METADATA>
<METADATA>
<author>john smith3</author>
<generator>visual notepad3</generator>
<PAGETYPE>Reference3</PAGETYPE>
<abstract>specifies a data island3</abstract>
</METADATA>
</root>
</xml>
The second step is to determine the binding container, where we use the table
<table datasrc= "#xmlData" border=1>
<TR>
<td><span datafld= "AUTHOR" >loading...</span></TD>
<td><span datafld= "Generator" >loading...</span></TD>
<td><span datafld= "PageType" >loading...</span></TD>
<td><span datafld= "ABSTRACT" >loading...</span></TD>
</TR>
</TABLE>
Take these two pieces of code copy to your HTML page to run both to see the effect.
The first segment is our XML data source, which is the data to bind, the metadata node equals the table name, AUTHOR, generator, pagetype, and abstract are equivalent to the column name, and the following table is the container for displaying the data. <table datasrc= "#xmlData" border=1> is the data source for the specified TABLE, <span datafld= "AUTHOR" >loading...</span> bound field names.
All right, I'll see how this can be done with Ajax to achieve no flush binding.
Step One: Configure Ajax to add a configuration section to the Web.config file:
<add verb= "Post,get" path= "Ajaxpro/*.ashx" type= "ajaxpro.ajaxhandlerfactory, Ajaxpro"/>
The second step is to write the code that returns the dataset:
public class MyClass
{
[Ajaxmethod]
public string GetDataSet ()
{
DataSet DST = new DataSet ();
DataTable dt = new DataTable ();
Dt. Columns.Add ("Text");
Dt. Columns.Add ("number");
Random Random = new Random (Guid.NewGuid (). GetHashCode ());
for (int i = 0; i < random. Next (10,20); i++)
{
DataRow row = dt. NewRow ();
row["Text"] = Guid.NewGuid (). ToString ("N");
row["number"] = random. Next (100);
Dt. Rows.Add (row);
}
Dst. Tables.add (DT);
String text = "";
using (MemoryStream ms = new MemoryStream ())
{
Dst. WriteXml (MS);
Ms. Position = 0;
StreamReader sr = new StreamReader (MS);
Text = Sr. ReadToEnd ();
}
return text;
}
}

Step Three: Register the method in Page_Load, AjaxPro.Utility.RegisterTypeForAjax (typeof (Webtest1.ajaxtest1)) (WebTest1 is the name of the namespace)
Step Fourth: Add client Bindings

<input onclick= "WebTest1.MyClass.GetDataSet (callback)" type= "button" value= "GetDataSet" >
<div id= "Odatapanel" >
</div>
<table datasrc= "#xmlData" width= "1" border= "
cellspacing= "1" cellpadding= "1" >
<thead>
<tr>
<th width= "70%" > Name </th>
<th width= "30%" > Age </th>
</tr>
</thead>
<TR>
<td><span datafld= "Text" ></span></TD>
<td><span datafld= "Number" ></span></TD>
</TR>
</TABLE>
<div id= "Odatapanel" > is a container for storing XML data sources

Fifth step: Edit the JavaScript code to load data
Function callback (RES)
{
if (!res.error)
{
Document.all.oDataPanel.innerHTML = <xml id= "xmlData" >+ res.value +</xml>;
}
Else
{
alert (res.error.Message);
}
}