Javascript 添加/删除/删除后JQGrid不会重新加载更新

我有一个JQGrid，它通过对web服务的ajax调用进行更新

除了更新网格（并将其写回数据库）时，所有这些更改都不会反映在网格中之外，都可以正常工作

我读过一些有人报道类似问题的帖子，但我尝试过这些建议，但都无济于事

loadonce设置为false时，我将数据类型重置为JSON，并且在重新加载之前尝试破坏网格

这是迄今为止我的代码

function LoadGrid2() {
    //jgcontracts Grid

        $.ajax({
        type: "POST",
        contentType: "application/json",
        url: "../WebService1.asmx/getDataContacts",
        dataType: "json",
        success: function (data) {
            data = data.d;

            $("#jqcontacts").jqGrid({
                datatype: "local",
                colNames: ['Contact ID', 'Customer ID', 'First Name', 'Last Name', 'Email'],
                colModel: [
                    { name: 'contid', key: true, index: 'contid', width: 55, editable: true },
                    {
                        name: 'cust_name', index: 'cust_name', width: 80, align: "left", editable: true, edittype: "select",
                        editoptions: {
                            value: {}
                        }
                    },
                    { name: 'first_name', index: 'first_name', width: 55, editable: true },
                    { name: 'last_name', index: 'last_name', width: 55, editable: true },
                    { name: 'email', index: 'email', width: 170, editable: true }
                ],
                data: data,
                caption: "Contacts",
                viewrecords: true,
                height: 200,
                rowNum: 10,
                pager: "#jqcontactsPager"
            });

            $('#jqcontacts').navGrid('#jqcontactsPager',
                // the buttons to appear on the toolbar of the grid
                { edit: true, add: true, del: true, search: false, refresh: false, view: false, position: "left", cloneToTop: false },
                // options for the Edit Dialog
                {
                    url: "../WebService1.asmx/modifyDataContacts",
                    editData: {},
                    editCaption: "The Edit Dialog",
                    beforeShowForm: function (form) {
                        $('#contid', form).attr("disabled", true);
                    },
                    reloadAfterSubmit: true,
                    recreateForm: true,
                    checkOnUpdate: true,
                    checkOnSubmit: true,
                    closeAfterEdit: true,
                    errorTextFormat: function (data) {
                        return 'Error: ' + data.responseText
                    }
                },
                // options for the Add Dialog
                {
                    url: "../WebService1.asmx/addDataContacts",
                    addData: {},
                    editCaption: "The Add Dialog",
                    beforeShowForm: function (form) {
                        $('#contid', form).attr("disabled", true);
                    },
                    closeAfterAdd: true,
                    recreateForm: true,
                    errorTextFormat: function (data) {
                        return 'Error: ' + data.responseText
                    }
                },
                // options for the Delete Dailog
                {
                    url: "../WebService1.asmx/deleteDataContacts",
                    delData: {},
                    delCaption: "The Delete Dialog",
                    errorTextFormat: function (data) {
                        return 'Error: ' + data.responseText
                    }
                });
        },
        error:
            function (msg) {
                alert(msg.status + " " + msg.statusText);
            }
    });
}

这是我的WebMethod

    [WebMethod]
    public object getDataContacts()
    {

        SqlConnection con = new SqlConnection(System.Configuration.ConfigurationManager.ConnectionStrings["Indigo2.Properties.Settings.Constr"].ConnectionString);

        SqlCommand cmd = new SqlCommand();

        cmd.CommandText = "SELECT [contid] ,cust.[cust_name] ,[first_name] ,[last_name] ,[email] FROM [Indigo].[dbo].[contacts] con LEFT JOIN [Indigo].[dbo].[customers] cust on con.custid = cust.custid";
        cmd.CommandType = CommandType.Text;
        cmd.Connection = con;
        con.Open();
        SqlDataAdapter da = new SqlDataAdapter(cmd);
        con.Close();
        DataSet ds = new DataSet();
        da.Fill(ds);

        object obj = new JavaScriptSerializer().DeserializeObject(Newtonsoft.Json.JsonConvert.SerializeObject(ds.Tables[0]));
        return obj;


    }

---

非常感谢您的帮助。

您不需要此代码

afterSubmit: function () {
    $("#jqcontacts").setGridParam({ datatype: 'json'}).trigger('reloadGrid');
    return [true];
},

和您一样，您也要执行两个ajax调用。如果您在网格参数中设置editurl，或者像您这样设置url，那么编辑后的数据将通过ajax调用自动发布到服务器，而不是使用本地数据类型

发布编辑的数据时，jqGrid查找url（editurl）参数，而不是数据类型

移除后ubmit事件并进行测试。如果未保存数据，则需要查看您发布到服务器的内容以及用于保存数据的服务器端代码

当我们谈到保存、检索、排序等时，Guriddo jqGrid是独立于服务器端的javascript库，。。。来自服务器端的数据

更新 我明白这是为什么了。 让我解释一下

问题：您如何获得初始数据

答：您可以通过自己的ajax调用获取数据，然后将该数据传递到数据类型为local的网格

问：你如何更新你的数据

答：您可以使用内置的jqGrid功能通过单独调用远程将数据更新到服务器

问题：如果数据类型是本地的，并且更新是服务器端的，那么更新不会反映网格中的本地数据，因为重新加载它后，它会重新加载当前本地数据，而该数据不会受到更新的影响

如何解决？你有多个选择

重新构建网格，以便使用网格选项url和jsonReader直接获取数据。也许您需要在这里阅读-也就是说，您与数据的所有交互都是服务器端的

如果您不想进行服务器排序、分页等操作，可以将网格选项loadonce与从servrer和jsonReader获取数据的url组合使用。在这种情况下，您需要从服务器返回所有数据（不是部分数据）。如果这样做，那么可以在beforeSubmit事件中将datatype设置为json，这样当网格在更新后重新加载时，它将从服务器读取更新的数据

不要更改您当前的网格配置，但是在这种情况下，您需要在navigator中将选项reloadAfterSubmit设置为false，并为更新本地网格数据写入附加值

我希望你使用选项2

---

我发现在这种情况下网格存在一个小问题，我们将在未来的版本中尝试解决它。

谢谢@Tony。我已经删除了afterSubmit:code，但它仍然没有更新。正在将更改保存到我的数据库中。但网格不会更新。我已经在上面进行了编辑，以显示我的当前代码和我的WebService调用。有什么帮助吗appreciated@user3580480我已经更新了我的答案。你看，谢谢，我试过第二种方法，但是没有用。选项1已修复了多个问题。非常感谢Barry@user3580480非常感谢。很高兴听到问题解决了。