首页 > 代码库 > 使用jquery+一般处理程序异步加载信息

使用jquery+一般处理程序异步加载信息

需求:有时候,web界面对性能要求比较高,我们就不考虑使用asp.net控件,而是使用html标签+jquery+一般处理程序来进行异步处理。


aspx代码:

   <asp:Repeater ID="rptRecordList" runat="server">
                                    <HeaderTemplate>
                                        <table style="width: 100%;">
                                    </HeaderTemplate>
                                    <ItemTemplate>
                                        <tr class="order-item">
                                            <td style="width: 96px;" class="item">
                                                <span style="margin-right: 4px;"><%# Container.ItemIndex +1 %></span>
                                                <input type="radio" id="rbtn1" value=http://www.mamicode.com/'' />>css代码我就省略了,直接列js代码:
        var getAccountInfo = function (data) {
            $("#lblClientName").html(data.ClientName);
            $("#lblClientNo").html(data.ClientNo);
            $("#lblCell").html(data["Cell"]);
            $("#lblTel").html(data["Tel"]);

            $("#lblMeterCode").html(data["MeterCode"]);
            $("#lblElectronicMeteNo").html(data["ElectronicMeteNo"]);
            $("#lblMeterStatus").html(data["MeterStatus"]);
            $("#lblMeterAddress").html(data["MeterAddress"]);

            $("#lblWaterNature").html(data["WaterNature"]);
            $("#lblWaterPrice").html(data["WaterPrice"]);
            $("#lblSewagePrice").html(data["SewagePrice"]);
            $("#lblWaterPopulation").html(data["WaterPopulation"]);

            var error = data["error"];
            if (error != null && error != undefined && error != "") {
                error = errorMsg + error;
                $("#spnError").html(error);
                $("#divError").attr("visibility", "visible");
            }
            else {
                $("#spnError").html("");
                $("#divError").attr("visibility", "hidden");
            };
        }
        //根据选中的水表来客户详细信息
        function getInfoBySelect(meterId) {
            $.getJSON("Handlers/PrepaymentBusinessHandler.ashx", { "meterId": meterId }, getAccountInfo);
        }
一般处理程序:
    /// <summary>
    /// PrepaymentBusinessHandler 的摘要说明
    /// </summary>
    public class PrepaymentBusinessHandler : IHttpHandler
    {
        IOrganizationService _serviceProxy = PrepaymentBusinessHandle._serviceProxy;
        int _maxReturnCount = 10;
        string error = string.Empty;

        public void ProcessRequest(HttpContext context)
        {
            context.Response.ContentType = "text/plain";
            string meterId = context.Request["meterId"];
            JavaScriptSerializer jsonSerializer = new JavaScriptSerializer();
            string outputString =GetModel(meterId)==null?string.Empty: jsonSerializer.Serialize(GetModel(meterId));

            if(!string.IsNullOrEmpty(error))
            {
                outputString =string.IsNullOrEmpty(outputString)?"{\"error\":\""+ error+"\"}":outputString.Trim('}')+",\"error\":\""+ error+"\"}";
            }
            context.Response.Write(outputString);
        }

        /// <summary>
        /// 根据选择的记录获取客户详细信息
        /// <param name="accountNumber">水表ID</param>
        /// </summary>
        /// <returns></returns>
        EntityCollection GetAccountInfoBySelectRecord(string meterId)
        {
            EntityCollection etResults = null;
            if (string.IsNullOrEmpty(meterId))
            {
                return etResults;
            }
            string fetchXml = @"<fetch version='1.0' output-format='xml-platform' mapping='logical' distinct='false' count='" + _maxReturnCount.ToString() + @"'>
                <entity name='hx_t_customerandmeterrela'>
                <attribute name='hx_fwaterpropertyid' />
                <attribute name='hx_fmeterid' />
                <attribute name='hx_faccountid' />
                <filter type='and'>
                <condition attribute='hx_fmeterid' operator='eq' value=http://www.mamicode.com/'">思路:使用jquery发送请求,并传递参数给一般处理程序,一般处理程序从数据库中获取数据后先序列化然后再传回web界面,再使用jquery反序列化获取信息。


使用jquery+一般处理程序异步加载信息