javascript - 如何在ajax调用中传递值？

Question

在我的下面的代码中，更新功能在ajax中不起作用..如何解决这个问题，..

在我的代码编辑方法中运行良好..

例如:在此代码中，值正在传递 var name = row.find(".ContactPersonName").find("span").html();

但是在更新时，值没有传递给它

data: '{hospitalID: ' + HospitalID + ',contactID: ' + ContactID + ', DepartmentID: "' + DepartmentID + '",DesignationID: "' + DesignationID + '",ContactPersonAddress:"' + ContactPersonAddress + '",Phone:"' + Phone + '",AadhaarCardNo:"' + AadhaarCardNo + '", name: "' + name + '", mobile: "' + mobile + '" }',

GridView

<asp:GridView ID="gvCustomers" runat="server" AutoGenerateColumns="false"    >
        <Columns>
             <asp:TemplateField HeaderText="Department"  ItemStyle-CssClass="DepartmentID" >
                <ItemTemplate>
                    <asp:Label Text='<%# Eval("DepartmentID") %>' runat="server" />
                    <asp:TextBox Text='<%# Eval("DepartmentID") %>' runat="server" Style="display: none;width:100px;" />
                </ItemTemplate>
            </asp:TemplateField>
             <asp:TemplateField HeaderText="Designation"  ItemStyle-CssClass="DesignationID">
                <ItemTemplate>
                    <asp:Label Text='<%# Eval("DesignationID") %>' runat="server" />
                    <asp:TextBox Text='<%# Eval("DesignationID") %>' runat="server" Style="display: none;width:100px;" />
                </ItemTemplate>
            </asp:TemplateField>
            <asp:TemplateField HeaderText="ContactPersonName"  ItemStyle-CssClass="ContactPersonName">
                <ItemTemplate>
                    <asp:Label Text='<%# Eval("ContactPersonName") %>' runat="server" />
                    <asp:TextBox Text='<%# Eval("ContactPersonName") %>' runat="server" Style="display: none;width:100px;" />
                </ItemTemplate>
            </asp:TemplateField>
            <asp:TemplateField HeaderText="ContactPersonAddress"  ItemStyle-CssClass="ContactPersonAddress">
                <ItemTemplate>
                    <asp:Label Text='<%# Eval("ContactPersonAddress") %>' runat="server" />
                    <asp:TextBox Text='<%# Eval("ContactPersonAddress") %>' runat="server" Style="display: none;width:100px;" />
                </ItemTemplate>
            </asp:TemplateField>
            <asp:TemplateField HeaderText="Mobile" ItemStyle-CssClass="Mobile">
                <ItemTemplate>
                    <asp:Label  Text='<%# Eval("Mobile") %>' runat="server" />
                    <asp:TextBox  Text='<%# Eval("Mobile") %>' runat="server" Style="display: none;width:100px;" />
                </ItemTemplate>
            </asp:TemplateField>
             <asp:TemplateField HeaderText="Phone" ItemStyle-CssClass="Phone">
                <ItemTemplate>
                    <asp:Label Text='<%# Eval("Phone") %>' runat="server" />
                    <asp:TextBox Text='<%# Eval("Phone") %>' runat="server" Style="display: none;width:100px;" />
                </ItemTemplate>
            </asp:TemplateField>
            <asp:TemplateField HeaderText="AadhaarCardNo" ItemStyle-CssClass="AadhaarCardNo">
                <ItemTemplate>
                    <asp:Label Text='<%# Eval("AadhaarCardNo") %>' runat="server" />
                    <asp:TextBox Text='<%# Eval("AadhaarCardNo") %>' runat="server" Style="display: none;width:100px;" />
                </ItemTemplate>
            </asp:TemplateField>
            <asp:TemplateField>
                <ItemTemplate>
                    <asp:LinkButton Text="Edit" runat="server" CssClass="Edit" />
                    <asp:LinkButton Text="Update" runat="server" CssClass="Update" Style="display: none" />
                    <asp:LinkButton Text="Cancel" runat="server" CssClass="Cancel" Style="display: none" />
                    <asp:LinkButton Text="Delete" runat="server" CssClass="Delete" />
                </ItemTemplate>
            </asp:TemplateField>
        </Columns>
    </asp:GridView>

编辑和更新代码

<script type="text/javascript">

        var pageUrl = '<%=ResolveUrl("~/HosProfileSetting.aspx")%>'
        //Edit event handler.
        $("body").on("click", "[id*=gvCustomers] .Edit", function () {
            var row = $(this).closest("tr");
            $("td", row).each(function () {
                if ($(this).find("input").length > 0) {
                    $(this).find("input").show();
                    $(this).find("span").hide();
                }
            });
            row.find(".Update").show();
            row.find(".Cancel").show();
            row.find(".Delete").hide();
            $(this).hide();
            return false;
        });

        //Update event handler.
        $("body").on("click", "[id*=gvCustomers] .Update", function () {
            var row = $(this).closest("tr");
            $("td", row).each(function () {
                if ($(this).find("input").length > 0) {
                    var span = $(this).find("span");
                    var input = $(this).find("input");
                    span.html(input.val());
                    span.show();
                    input.hide();
                }
            });
            row.find(".Edit").show();
            row.find(".Delete").show();
            row.find(".Cancel").hide();
            $(this).hide();

            //var customerId = row.find(".CustomerId").find("span").html();
            var ContactID = jQuery('[id$=hdnHospitalContactPersonID]').val();
            var HospitalID = jQuery('[id$=hdnHospitalId]').val();
            var DepartmentID = row.find(".DepartmentID").find("span").html(); 
            var DesignationID = row.find(".DesignationID").find("span").html();
            var name = row.find(".ContactPersonName").find("span").html();
            var Address = row.find(".ContactPersonAddress").find("span").html();
            var mobile = row.find(".Mobile").find("span").html();
            var Phone = row.find(".Phone").find("span").html();
            var AadhaarCardNo = row.find(".AadhaarCardNo").find("span").html();
            $.ajax({
                type: "POST",
                url: pageUrl + '/UpdateHospitalContact',
                data: '{hospitalID: ' + HospitalID + ',contactID: ' + ContactID + ', DepartmentID: "' + DepartmentID + '",DesignationID: "' + DesignationID + '",ContactPersonAddress:"' + ContactPersonAddress + '",Phone:"' + Phone + '",AadhaarCardNo:"' + AadhaarCardNo + '", name: "' + name + '", mobile: "' + mobile + '" }',
                contentType: "application/json; charset=utf-8",
                dataType: "json"
            });
            return false;
        });

        //Cancel event handler.
        $("body").on("click", "[id*=gvCustomers] .Cancel", function () {
            var row = $(this).closest("tr");
            $("td", row).each(function () {
                if ($(this).find("input").length > 0) {
                    var span = $(this).find("span");
                    var input = $(this).find("input");
                    input.val(span.html());
                    span.show();
                    input.hide();
                }
            });
            row.find(".Edit").show();
            row.find(".Delete").show();
            row.find(".Update").hide();
            $(this).hide();
            return false;
        });

    </script>

[Web方法]

 [WebMethod]
    public static UserAjax UpdateHospitalContact(int hospitalID, int contactID, int DepartmentID, int DesignationID, string name, string ContactPersonAddress, string Phone, string mobile, string AadhaarCardNo)
    {
        UserAjax oUserAjax = new UserAjax();
        BD_Hospital oHospital = new BD_Hospital();
        oHospital.DepartmentID = DepartmentID;
        oHospital.DesignationID = DesignationID;
        oHospital.ContactPersonName = name;
        oHospital.ContactPersonAddress = ContactPersonAddress;
        oHospital.Mobile = mobile;
        oHospital.Phone = Phone;
        oHospital.AadhaarCardNo = AadhaarCardNo;
        oHospital.HospitalContactPersonID = Convert.ToInt32(contactID);
        oHospital.UpdateHospital();
        return oUserAjax;
    }

Answer 1

您更新的医院联系方式是 get 方法。因此，您可以将参数作为查询字符串传递。更新您的 AJAX 方法，如下所示。

 $.ajax({
          type: "Get",
          url: pageUrl + '/UpdateHospitalContact?hospitalID=' + HospitalID + '&contactID=' + ContactID + '&DepartmentID=' + DepartmentID + '&DesignationID=' + DesignationID + '&ContactPersonAddress=' + ContactPersonAddress + '&Phone=' + Phone + '&AadhaarCardNo=' + AadhaarCardNo + '&name=' + name + '&mobile=' + mobile,
          contentType: "application/json; charset=utf-8",
          dataType: "json"
       });