I learned several ASP.NET's AJAX ability today! It is so interesting and so easy to use AJAX in ASP.NET.

来源:互联网 发布:淘宝提高动态评分 编辑:程序博客网 时间:2024/05/18 02:38

The first example is about Gridview Control. The most important Property here is EnableSortingAndPagingCallbacks Property. From the word you can see that, if you set it true, the control will get AJAX ability and it can sort and page without flashing the page.
The code is here:
<asp:GridView ID="GridView1" runat="server" AllowPaging="True" AllowSorting="True"
            AutoGenerateColumns="False" DataKeyNames="CustomerID" DataSourceID="SqlDataSource1"
            EnableSortingAndPagingCallbacks="True" PageSize="5">
    <Columns>
 <asp:BoundField DataField="CustomerID" HeaderText="CustomerID" ReadOnly="True" SortExpression="CustomerID" />
 <asp:BoundField DataField="CompanyName" HeaderText="CompanyName" SortExpression="CompanyName" />
 <asp:BoundField DataField="ContactName" HeaderText="ContactName" SortExpression="ContactName" />
 <asp:BoundField DataField="ContactTitle" HeaderText="ContactTitle" SortExpression="ContactTitle" />
 <asp:BoundField DataField="Address" HeaderText="Address" SortExpression="Address" />
    </Columns>
</asp:GridView>
<asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"
    SelectCommand="SELECT [CustomerID], [CompanyName], [ContactName], [ContactTitle], [Address] FROM [Customers]">
</asp:SqlDataSource>

The second example is about TreeView.
<asp:TreeView ID="TreeView1" runat="server" Height="174px" ImageSet="XPFileExplorer" Width="169px" OnTreeNodePopulate="TreeView1_TreeNodePopulate">
    <Nodes>
 <asp:TreeNode Text="Visual Stdio 2005" Value="C:/Documents and Settings/v-soguo/My Documents/Visual Studio 2005" Expanded="False"  PopulateOnDemand="True"/>
    </Nodes>
</asp:TreeView>

It is the same as the gridview. PopulateNodesFromClient is the key property here. If you set it true, it will asynchronously populate the children when it is expended. On the client side, you will find it is no refreshing. By the way this property 's default value is true.
The Server side code is here:
protected void TreeView1_TreeNodePopulate(object sender, TreeNodeEventArgs e)
{
 DirectoryInfo info = new DirectoryInfo(e.Node.Value);
 foreach (DirectoryInfo directory in info.GetDirectories())
 {
     TreeNode newNode = new TreeNode();
     newNode.PopulateOnDemand = true;
     newNode.Text = directory.Name;
     newNode.Value = directory.FullName;
     e.Node.ChildNodes.Add(newNode);
 }

 foreach (FileInfo file in info.GetFiles())
 {
     TreeNode newNode = new TreeNode();
     newNode.Text = file.Name;
     newNode.Value = file.FullName;
     e.Node.ChildNodes.Add(newNode);
 }
}

The third example is implement the AJAX by ICallbackEventHandler.
At first, the page must inherit the ICallbackEventHandler as below:
public partial class _Default : System.Web.UI.Page ,ICallbackEventHandler

protected void Page_Load(object sender, EventArgs e)
    {
        string cbReference = this.ClientScript.GetCallbackEventReference(
            this, "this.value", "OnSuccessCallback", null, "OnFailureCallback", true);
        this.DropDownList1.Attributes["onchange"] = cbReference;

/* For the server button control, if you don't want it to be postbacked, you have to add "return false" at the end of  the event. In fact, ClientScript.GetCallbackEventReference created a complete string which is be binded to the client event, such as onclick of the button.
            string btnReference = ClientScript.GetCallbackEventReference(
            this, "this.name", "OnSuccessCallback", null, "OnFailureCallback", true);
            this.Button1.Attributes["onclick"] = btnReference + ";return false";  */

    }

second you have to implement the two function of the ICallbackEventHandler,one is RaiseCallbackEvent, the other is GetCallbackResult. RaiseCallbackEvent is to do some process of the call beginning. GetCallbackResult returns the result by means of string.

private int indexer=0; // the indicator of the value.
string[] strs = new string[] {"a","b","c","d","e" }; // the value want to return .
void ICallbackEventHandler.RaiseCallbackEvent(string argumnet)
{
 indexer = int.Parse(argumnet);
}

string ICallbackEventHandler.GetCallbackResult()
{
 return strs[indexer];
}

<input id="Text1" type="text" />
<asp:DropDownList ID="DropDownList1" runat="server" Width="193px">
    <asp:ListItem>1</asp:ListItem>
    <asp:ListItem>2</asp:ListItem>
    <asp:ListItem>3</asp:ListItem>
    <asp:ListItem>4</asp:ListItem>
    <asp:ListItem>5</asp:ListItem>
    <asp:ListItem>6</asp:ListItem>
</asp:DropDownList>

function OnSuccessCallback(result,context)
{
    document.getElementById("Text1").innerText = result;
}

function OnFailureCallback(errmessage)
{
    document.getElementById("Text1").innerText = "Error:" + errmessage;

原创粉丝点击