jQuery控件jqGrid的删除

使用了jqGrid处理数据，总结一下中间遇到的问题。代码如下：

var gridimgpath = '../App_Themes/Default/Images/'; 

        jQuery().ready(function() {
            $("#tbEntrustDate").datepicker({ dateFormat: 'yy-mm-dd' });
            $("#tbMakelistDate").datepicker({ dateFormat: 'yy-mm-dd' });
            var predictArrivalDefaultValue = function() {
                var currentTime = new Date(); 

                var month = parseInt(currentTime.getMonth() + 1);
                month = month <= 9 ? "0" + month : month;
                var day = currentTime.getDate();
                day = day <= 9 ? "0" + day : day;
                var year = currentTime.getFullYear();
                return year + "-" + month + "-" + day;
            }; 

            $("#tbShipper").click(function() {
                tb_show("选择用户", "../CommonWindow/SelectShipper.aspx?TB_iframe=true&height=400&width=600", null);
            });
            $("#tbEntrustDate").val(predictArrivalDefaultValue());
            $("#tbMakelistDate").val(predictArrivalDefaultValue());
            $.LoadDataList(); 

        }); 

        jQuery.extend({
            LoadDataList: function() {
                var ShippingDocumentId = "";
                ShippingDocumentId = $("#lbshippingDocumentNumber")[0].innerText;
                jQuery("#lista1").jqGrid({
                    url: 'Freightinvoice_Temp.ashx?Action=' + ShippingDocumentId + '&op=query',
                    mtype: "POST",
                    datatype: "xml",
                    colNames: ['票号', '单价', '重量(kg)', '计费方式', '运费总额', '返还', '备注'],
                    colModel: [
           { name: 'FreightinvoiceNumber', index: 'FreightinvoiceNumber', width: 90, align: 'center' },
           { name: 'Price', index: 'Price', width: 90, align: 'center' },
           { name: 'Weight', index: 'Weight', width: 90, align: 'center' },
           { name: 'ChargeMode', index: 'ChargeMode', width: 90, align: 'center' },
           { name: 'ShippingTotalMoneny', index: 'ShippingTotalMoneny', width: 90, align: 'center' },
           { name: 'ReturnTotalmoney', index: 'ReturnTotalmoney', width: 90, align: 'center' },
           { name: 'Note', index: 'Note', width: 90, align: 'center' },
       ], 

                    //rowNum: 10,
                    //rowList: [10, 20, 30],
                    imgpath: gridimgpath,
                    autowidth: true,
                    rownumbers: true,
                    pager: jQuery('#pager1'),
                    sortname: 'FreightinvoiceNumber',
                    viewrecords: true,
                    sortorder: "desc",
                    caption: "货票数据",
                    viewsortcols: true,
                    multiselect: true,
                    editurl: 'Freightinvoice_Temp.ashx'
                }); 

                $('#lista1').navGrid('#pager1', //{ edit: false, add: false, del: true },
                {edit: false, add: false, del: true, search: false },
                {}, //edit options
                {}, // add options
                {reloadAfterSubmit: true,
                jqModal: false,
                closeOnEscape: true,
                afterSubmit: function(xhr, postdata) {
                    //alert(postdata);
                    $.UpdateDataList();
                    return [true];
                }
            }, // del options
                {closeOnEscape: true }, // search options
                {height: 250, jqModal: false, closeOnEscape: true} //reload option
                );
        },
        UpdateDataList: function() {
            jQuery("#lista1").trigger("reloadGrid");
            $.ajax({
                type: "GET",
                url: "../ShippingDocument/Freightinvoice_Temp_Total.ashx",
                data: 'Action=' + $("#lbshippingDocumentNumber")[0].innerText + '',
                dataType: 'xml',
                timeout: 1000,
                beforeSend: function(XMLHttpRequest) {
                    //ShowLoading();
                },
                success: function(data, textStatus) {
                    $(data).find("root").each(function() { 

                        var ShippingDocumentTotalMoney = $(this).find("ShippingDocumentTotalMoney").text(); 

                        var ReturnTotalmoney = $(this).find("ReturnTotalmoney").text(); 

                        $("#tbShippingTotalMoney").val(ShippingDocumentTotalMoney);
                        $("#tbreturnTotalMoney").val(ReturnTotalmoney); 

                    });
                },
                complete: function(XMLHttpRequest, textStatus) {
                    //HideLoading();
                },
                error: function() {
                    alert('error');
                }
            });
        }
    });   

以上是JS代码，实现的功能无非就是获取了一个列表。

html代码：

<table class="table" cellpadding="2">
            <tr>
                <td class="C1">
                    运单号码：
                </td>
                <td>
                    &nbsp;<asp:Label ID="lbshippingDocumentNumber" runat="server" Text=""></asp:Label></td>
                <td class="C1">
                    托运日期：
                </td>
                <td>
                   &nbsp;<asp:TextBox ID="tbEntrustDate" runat="server"></asp:TextBox></td>
            </tr>
            <tr>
                <td class="C1">
                    托运人：
                </td>
                <td>
                &nbsp;<asp:TextBox ID="tbShipper" runat="server" ></asp:TextBox><asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" 
                        ControlToValidate="tbShipper" ErrorMessage="*"></asp:RequiredFieldValidator></td>
                <td class="C1">
                    电话：
                </td>
                <td>
                    &nbsp;<asp:TextBox ID="tbShipperTel" runat="server"></asp:TextBox></td>
            </tr>
            <tr>
                <td class="C1">
                    运费总金额：
                </td>
                <td>
                    &nbsp;<asp:TextBox ID="tbShippingTotalMoney" runat="server"></asp:TextBox></td>
                <td class="C1">
                    运费返总额：
                </td>
                <td>
                    &nbsp;<asp:TextBox ID="tbreturnTotalMoney" runat="server"></asp:TextBox></td>
            </tr>
            <tr>
                <td class="C1">
                    &nbsp;制单日期：
                </td>
                <td colspan="3">
                    &nbsp;<asp:TextBox ID="tbMakelistDate" runat="server"></asp:TextBox></td>
            </tr>
            <tr>
                <td>
                    备注：</td>
                <td colspan="3">
                    &nbsp;<asp:TextBox ID="tbNote" runat="server" Width="400px"></asp:TextBox>
                </td>
            </tr>
            <tr>
                <td colspan="4">
                    <a href="Freightinvoice_Add.aspx?Action=<%= m_DataNumberContent %>TB_iframe=true&height=400&width=600"
                        title="货票添加" class="thickbox">添加货票</a>
                </td>
            </tr>
            <tr>
                <td colspan="4">
                    <table id="lista1">
                    </table>
                    <div id="pager1" class="scroll">
                    </div>
                </td>
            </tr>
            <tr>
                <td colspan="4" class="Bottom">
                    <asp:Button ID="Button1" runat="server" Text=" 添 加 " OnClientClick="javascript:$.UpdateDataList();return false;" />
                </td>
            </tr>
        </table>

 

实现的功能是更新显示列表，并且要更新上面的运费总金额和返款总金额。

处理程序代码：

 

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Services;
using ExtSoft.Core.Entity;
using ExtSoft.BLL;
using ExtSoft.Core.Common; 

namespace ExtSoft.Website.ShippingDocument
{
    /// <summary>
    /// $codebehindclassname$ 的摘要说明
    /// </summary>
    [WebService(Namespace = "http://tempuri.org/")]
    [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
    public class Freightinvoice_Temp : IHttpHandler
    {
        private string shippingDocumentNumber = string.Empty;
        public void ProcessRequest(HttpContext context)
        {
            shippingDocumentNumber = ExtSoftContext.Current.Action; 

            string page = context.Request.QueryString["page"];
            string rows = context.Request.QueryString["rows"];
            string sidx = context.Request.QueryString["sidx"];
            string sord = context.Request.QueryString["sord"]; 

            string oper = context.Request.Form["oper"]; //执行操作参数选项
            string FreightinvoiceId = context.Request.Form["id"]; //将要执行的Id
            //shippingDocumentNumber = "TYD20090922018";
            if (oper == "del")
            {
                DelData(FreightinvoiceId);
            }
            else
            {
                context.Response.ContentType = "text/xml";
                string xmlstr = CreateXML();
                context.Response.Write(xmlstr);
                context.Response.Flush();
            }
        } 

        private void DelData(string FreightinvoiceId)
        {
            FreightinvoiceBLL freightinvoicebll = new FreightinvoiceBLL();
            freightinvoicebll.DeleteData(FreightinvoiceId);
        } 

        private string CreateXML()
        {
            FreightinvoiceBLL freightinvoicebll = new FreightinvoiceBLL();
            IList<FreightinvoiceEntity> freightinvoicelist = new List<FreightinvoiceEntity>();
            freightinvoicelist = freightinvoicebll.GetDataList(shippingDocumentNumber);
            string xmlstr = "<?xml version='1.0' encoding=\"utf-8\"?>\n";
            xmlstr += "<rows>\n";
            xmlstr += "<page>1</page>\n";
            xmlstr += "<total>1</total>\n";
            xmlstr += "<records>1</records>\n";
            foreach (FreightinvoiceEntity freightinvoiceentity in freightinvoicelist)
            {
                xmlstr += "<row id='" + freightinvoiceentity.FreightinvoiceId + "'>";
                xmlstr += "<cell>" + freightinvoiceentity.FreightinvoiceNumber + "</cell>"; //货票号码
                xmlstr += "<cell>" + freightinvoiceentity.Price + "</cell>"; //单价
                xmlstr += "<cell>" + freightinvoiceentity.Weight + "</cell>"; //'重量'
                xmlstr += "<cell>" + freightinvoiceentity.ChargeMode + "</cell>";  //'计费方式'
                xmlstr += "<cell>" + freightinvoiceentity.ShippingTotalMoneny + "</cell>"; //'运费总额'
                xmlstr += "<cell>" + freightinvoiceentity.ReturnTotalmoney + "</cell>"; //'返还'
                xmlstr += "<cell>" + freightinvoiceentity.Note + "</cell>"; //'备注'
                xmlstr += "</row>\n";
            }
            xmlstr += "</rows>\n";
            return xmlstr;
        } 

        public bool IsReusable
        {
            get
            {
                return false;
            }
        }
    }
}

 

部分代码没有使用到。

 

问题总结：

1、在生成xml的时候没有写<row id=’123’>中的Id，造成读取的时候只读取列表的index索引值。

2、删除后更新数据，并且要更新运费总金额和返款总金额，这里是在删除事件中加入

afterSubmit: function(xhr, postdata) {
                    //alert(postdata);
                    $.UpdateDataList();
                    return [true];
}

 

来实现的。xhr是jQuery中的量，postdata是返回刚刚操作的数据id。

其他事件请参考相关英文文档。

希望给大家帮助。