现在的位置: 首页 > 综合 > 正文

AjaxRepeater控件

2013年05月13日 ⁄ 综合 ⁄ 共 3724字 ⁄ 字号 评论关闭

目标:让Repeater支持Ajax回调

方案:利用asp.net的Callback机制

控件代码:

using System;
using System.ComponentModel;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace Web.AjaxControl
{
    public delegate string DoCallback(string arg);
    [ToolboxData("<{0}:AjaxRepeater runat=server></{0}:AjaxRepeater>")]
    public class AjaxRepeater : Repeater,INamingContainer,ICallbackContainer,ICallbackEventHandler
    {
        public event DoCallback DoCallback;

        [DefaultValue(false)]
        public override bool EnableViewState
        {
            get
            {
                return base.EnableViewState;
            }
            set
            {
                base.EnableViewState = value;
            }
        }

         protected override void OnLoad(EventArgs e)
        {
              base.OnLoad(e);
              if (!this.Page.IsCallback && !this.Page.ClientScript.IsClientScriptBlockRegistered("_ajaxCallback"))
              {
                this.Page.ClientScript.RegisterClientScriptBlock(this.Page.GetType(), "_ajaxCallback", this.GetCallbackScript(null, null), true);
              }
        }

protected string Result
        {
            get;
            set;
        }
        public string GetCallbackResult()
        {
            return Result;
        }

        public void RaiseCallbackEvent(string eventArgument)
        {
            if (DoCallback!=null)
            {
                Result = DoCallback(eventArgument);
            }
        }

        public string GetCallbackScript(IButtonControl buttonControl, string argument)
        {
            //this.Page.ClientScript.GetCallbackEventReference(this, "arg", "callback", "context", "onError", true);
            return "function callServer(uniqueID,arg,onSuccess,onError){WebForm_DoCallback('" + this.Page.Request.RawUrl + "', uniqueID, arg, onSuccess,onError);return false;}";
            //return "function callServer(uniqueID,arg){WebForm_DoCallback(uniqueID,arg,onSuccess,'',onError,true);return false;}";            
        }
    }
}

页面代码:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="AjaxDemo.aspx.cs" EnableViewState="false" Inherits="WebApp.AjaxDemo" %>

<%@ Register Assembly="Web.AjaxControl" Namespace="Web.AjaxControl" TagPrefix="ajax" %>
<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>MS Ajax</title>
    <script src="Script/jquery.js"></script>
    <script src="Script/WebForm.js"></script>
    <script type="text/javascript">
        function onSuccess(data) {
            alert(data.substr(2));
        }
        function onError(XMLHttpRequest, textStatus, errorThrown) {
            alert(textStatus);
            alert(errorThrown);
        }
    </script>
</head>
<body>
    <form id="frm" runat="server">
        <div>
            <asp:CheckBox ID="CheckBox1" Text="ss试试水" runat="server" />
            <textarea name="a">ss</textarea>
            <asp:TextBox ID="TextBox2" Text="ssssddddddddddddd" runat="server"></asp:TextBox>
            <input name="sy" value="ev" />
            <ajax:AjaxRepeater ID="ajaxRepeater" runat="server">
                <HeaderTemplate>
                    <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
                    <input name="ss" value="ww" />
                    <input type="button" value="ajax提交" onclick="return callServer('ajaxRepeater','123',onSuccess,onError);" />
                </HeaderTemplate>
                <ItemTemplate>sss</ItemTemplate>
            </ajax:AjaxRepeater>
            <ajax:AjaxRepeater ID="AjaxRepeater1" runat="server">
                <HeaderTemplate>
                    <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
                    <input name="ss" value="ww" />
                    <input type="button" value="ajax提交" onclick="callServer('AjaxRepeater1', 'abc', 'shuia');" />
                </HeaderTemplate>
                <ItemTemplate>sss</ItemTemplate>
            </ajax:AjaxRepeater>
        </div>
    </form>
</body>
</html>

页面关键脚本:

function WebForm_DoCallback(url, uniqueID, arg, onSuccess, onError) {
    var postData = "__VIEWSTATE=&__CALLBACKID=" + encodeURIComponent(uniqueID) + "&__CALLBACKPARAM=" + encodeURIComponent(arg);

    $.ajax({
        url: url,
        type: "post",
        data: postData,
        dataType: "text",
        success: onSuccess,
        error: onError
    });
}

页面后台:

using System;
using System.Collections.Generic;

namespace WebApp
{
    public partial class AjaxDemo : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!IsPostBack)
            {
                ajaxRepeater.DataSource = new List<string>();
                ajaxRepeater.DataBind();
                AjaxRepeater1.DataSource = new List<string>();
                AjaxRepeater1.DataBind();
            }            
            if (IsCallback)
            {
                ajaxRepeater.DoCallback += ajaxRepeater_DoCallback;
            }
        }

        private string ajaxRepeater_DoCallback(string arg)
        {
            return arg;
        }
    }
}

丢弃了MS自带的某些玩意儿,欢迎大师砖拍!!!

抱歉!评论已关闭.