无法在 jqgrid 中使行进入编辑模式

Question

我用了以下

ondblClickRow: function(){
    var row_id = $("#grid").getGridParam('selrow');
    jQuery('#grid').editRow(row_id, true);
}

来自：

jqGrid Cell Editing - Double Click to Edit?

双击我可以得到警报，但 EditRow 功能根本不起作用。

-------更新-----------

这是我在客户端使用的以下代码：-

function setJqGridParameters(parsedResult) {
            var lastSel;
            $('#list').jqGrid('GridUnload');
            $("#list").jqGrid({
                colModel: JSON.parse(parsedResult.colModel),
                colNames: JSON.parse(parsedResult.col),
                datatype: "jsonstring",
                datastr: JSON.parse(parsedResult.rows),
                jsonReader: {
                    repeatitems: false
                },
                gridview: true,
                rowNum: 10,
                cmTemplate: { title: false }, //, sortable: false },
                viewrecords: false,
                loadonce: true,
                loadui: 'block',
                height: 'auto',
                autowidth: true,
                loadtext: "Loading....",
                pgbuttons: false,
                pginput: false,
                pgtext: "",
                shrinkToFit: false,
                hoverrows: false,
                ondblClickRow: function (rowid) {
                    if (rowid && rowid !== lastSel) {
                        $('#list').restoreRow(lastSel);
                        lastSel = rowid;
                    }
                    $(this).jqGrid("editGridRow", rowid, {
                        keys: true,
                        addCaption: "Add Record",
                        editCaption: "Edit Record",
                        bSubmit: "Submit",
                        bCancel: "Cancel",
                        bClose: "Close",
                        saveData: "Data has been changed! Save changes?",
                        bYes: "Yes",
                        bNo: "No",
                        bExit: "Cancel",
                        width: window.screen.width / 3,
                        top: window.screen.height / 4,
                        left: window.screen.availWidth / 3,
                        editUrl: 'TypicalVolume.aspx/UpdateVolumeData',
                        beforeSubmit: function (postData, formid) {
                            //alert(JSON.stringify(postData));
                             PostDataToServer(postData);
                            $(".ui-widget-overlay").trigger('click');
                            $('#list').trigger('reloadGrid');
                            return false;
                        },
                        afterShowForm: function (formid) {
                            $("#COl1").focus();
                            //var cm = $(this).jqGrid('getColProp', 'Specialty');
                            //debugger;

                        }
                    });
                    // debugger;
                    //                    var grid = $('#list');
                    //                    var myRowData = grid.getRowData(rowid);
                    //                    grid.editRow(rowid, true);
                    //alert(myRowData['Specialty'] + ' ' + myRowData['SpecialtyName']);
                },
                loadComplete: function () {
                    fixPositionsOfFrozenDivs.call(this);
                },

                onSortCol: function (index, icol, sortorder) {
                    sortColumns(index, icol, sortorder);
                    return 'stop';
                }
            });
            resizeColumnHeader.call($("#list")[0]);
            $("#list").parents('div.ui-jqgrid-bdiv').css("max-height", $(window).height() - $('#pivotGridDiv').offset().top - 60);
            $("#list").jqGrid('setFrozenColumns');
            $("#list").triggerHandler("jqGridAfterGridComplete");

            fixPositionsOfFrozenDivs.call($("#list")[0]);
            $(".s-ico").hide();
            var cm = $("#list")[0].p.colModel;
            $.each($("#list")[0].grid.headers, function (index, value) {
                var cmi = cm[index], colName = cmi.name;
                if (cmi.sortable) {
                    $('div.ui-jqgrid-sortable', value.el).css({ cursor: "pointer" });
                }
            });
        }
        function PostDataToServer(Data) {
            $.ajax({
                type: "POST",
                data: "{" + "Data" + ":" + JSON.stringify(Data) + "}",
                url: "TypicalVolume.aspx/UpdateVolumeData",
                //data: JSON.stringify(obj),
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (result) {
                    if (result.d == "null") {
                        RedirectToLogin();
                    }
                    else {
                        SetValues(result);
                    }

                },
                error: function (result) {
                    $('#loadingIndicator').hide();
                    alert("getPageLoadData: " + result.responseText);
                    //RedirectToErrorPage();
                }
            });
        }

SetJqGridParameters() 函数在页面加载时调用，该函数设置 Jqgrid 的所有参数。 我使用 PostDataToServer() 函数将数据发送到服务器并写入 Db 更改。 注意：- 如果我删除该功能，我会在 jqgrid.min.js 中收到空引用错误。

----服务器代码----

 [System.Web.Services.WebMethod]
[ScriptMethod(ResponseFormat = ResponseFormat.Json)]
public static string UpdateVolumeData(object Data)
{
    string WhereCondition1 = "",WhereCondition2="";
    List<string> UpdateStatements = new List<string>();
    Dictionary<string, string> data = new Dictionary<string, string>();
    data = ToDictionary(Data);
    foreach(KeyValuePair<string,string> entry in data)
    {
        if (entry.Key.ToString() == "MainCol1")
        {
            if (WhereCondition1 == "")
            {
                WhereCondition1 = WhereCondition1 + entry.Key.ToString() + "=" +"'"+ entry.Value.ToString()+"'";
            }
            else
            {
                WhereCondition1 = WhereCondition1 + "," + entry.Key.ToString() + "=" + "'"+entry.Value.ToString()+"'";
            }
        }
        else if (entry.Key.ToString() == "MainCol2")
        {
            if (WhereCondition2 == "")
            {
                WhereCondition2 = WhereCondition2 + entry.Key.ToString() + "=" +"'"+ entry.Value.ToString()+"'";
            }
            else
            {
                WhereCondition2 = WhereCondition2 + "," + entry.Key.ToString() + "=" +"'"+ entry.Value.ToString()+"'";
            }
        }
    }
    foreach (KeyValuePair<string, string> entry in data)
    {
        if (entry.Key.ToString() != "MainCol1" && entry.Key.ToString() != "MainCol2")
        {
            UpdateStatements.Add("Update TypicalVolume set TypicalVolume = " + entry.Value + " where Modality = '" + entry.Key + "' and " + WhereCondition1 + " and " + WhereCondition2);
        }
    }
    //JavaScriptSerializer serializer = new JavaScriptSerializer();
    //var data = serializer.Serialize(Data);
    string sqlstatements = string.Join(" ", UpdateStatements);
    SqlConnection conn = new SqlConnection(sqlConnectionString);
    conn.Open();
    SqlCommand cmd = new SqlCommand(sqlstatements, conn);
    cmd.ExecuteNonQuery();
    conn.Close();
    GridData gd = new GridData();
    gd = GetGridData();
    JavaScriptSerializer serializer = new JavaScriptSerializer();
    return serializer.Serialize(gd);
}

 [System.Web.Services.WebMethod]
[ScriptMethod(ResponseFormat = ResponseFormat.Json)]
public static string GetDataBySearchCriteria()
{
    try
    {
        HttpContext.Current.Session["RoleID"] = 4;
        if (HttpContext.Current.Session["RoleID"] != null)
        {
            if (!CheckAuthorization()) // Redirect to error page if not authorized
            {
                throw new Exception("Un Authorized Acess");
            }
            else
            {
                HttpContext.Current.Session["TypicalVolumeSession"] = null; 
                if (HttpContext.Current.Session["TypicalVolumeSession"] != null)
                {

                    GridData gd = new GridData();
                    gd = HttpContext.Current.Session["TypicalVolumeSession"] as GridData;
                    JavaScriptSerializer serializer = new JavaScriptSerializer();
                    GridData gd1 = GetGridData();
                    return serializer.Serialize(gd1);
                }
                else
                {
                    HttpContext.Current.Session["TypicalVolumeSession"] = null;
                    GridData gridData = new GridData();
                    DataSet ds = SqlHelper.ExecuteDataset(sqlConnectionString, CommandType.StoredProcedure, "GetTypicalVolumes");

                   DataTable Datadt = ds.Tables[0];
                    //create col model for jqgrid
                    StringBuilder sbcol = new StringBuilder();
                    sbcol.Append("[");
                    foreach (DataColumn column in Datadt.Columns)
                    {
                        sbcol.Append("\"").Append(column.ColumnName).Append("\",");
                    }
                    sbcol.Remove(sbcol.Length - 1, 1).Append("]");
                    StringBuilder sbcolModel = new StringBuilder();
                    sbcolModel.Append("[");
                    string[] rowAreaFields = "MainCol1,MainCol2".Split(',');

                    //create rowdata for jqgrid
                    foreach (DataColumn column in Datadt.Columns)
                    {
                        if (rowAreaFields.Contains(column.ColumnName.Trim()))//apply style for row area fields
                        {
                            sbcolModel.Append("{\"name\":\"").Append(column.ColumnName.Trim()).Append("\",\"index\":\"").Append(column.ColumnName.Trim()).Append("\",\"classes\":\"colstyle\",\"align\":\"left\",\"editable\":true,\"editoptions\": { \"disabled\": \"disabled\" },\"sortable\":true,\"frozen\":true},");
                        }
                        else
                        {
                            sbcolModel.Append("{\"name\":\"").Append(column.ColumnName.Trim()).Append("\",\"index\":\"").Append(column.ColumnName.Trim()).Append("\",\"align\":\"right\",\"sortable\":false,\"editable\":true,\"width\":\"60px\"},");
                        }

                    }
                    sbcolModel.Remove(sbcolModel.Length - 1, 1);
                    sbcolModel.Append("]");


                    JavaScriptSerializer serializer = new JavaScriptSerializer();
                    List<Dictionary<string, object>> rows = new List<Dictionary<string, object>>();
                    Dictionary<string, object> drow;
                    foreach (DataRow dr in Datadt.Rows)
                    {
                        drow = new Dictionary<string, object>();
                        foreach (DataColumn col in Datadt.Columns)
                        {
                            drow.Add(col.ColumnName, dr[col]);
                        }
                        rows.Add(drow);
                    }
                    StringBuilder sbjsonRows = new StringBuilder();
                    sbjsonRows.Append(serializer.Serialize(rows));

                    StringBuilder json = new StringBuilder();
                    json.Append("{").Append("\"rows\":").Append(sbjsonRows.ToString().Trim()).Append("}");
                    json.ToString();
                    gridData.col = sbcol.ToString();
                    gridData.colModel = sbcolModel.ToString();
                    gridData.rows = sbjsonRows.ToString().Trim();
                    return serializer.Serialize(gridData);//serialize and return to ajax method
                }
            }
        }
        else
        {
            return "null";//if session expired
        }
    }
    catch (Exception ex)
    {
        LogError(ex);
        throw;
    }
}

该代码处于测试模式，仍在开发中，该代码是我开发的其他页面的模板，因此它使用了会话，但目前实际上并不需要它。

要求：- 我有很多数据。所以我想更新数据库并显示来自数据库的真实数据。因为其他用户可能已经更新了它。所以如果可能的话，我可能想以一种懒惰的方式加载数据，我可以加载 3 个页面的数据，然后继续在后台加载（我在 jqgrid 中有这样的选项吗）。 如果它不可行加载整个数据是可以的。

我还希望用 C# 制作示例，并以尽可能多的方式将它们贡献给其他新用户。这样用户就可以在一个地方找到所有文档和帮助。请建议我也可以这样做。

对于那些参考这个的人：- 这个问题最初是针对可编辑行开始的。我从@Oleg 得到的第一个建议就足够了。后来他发现我的代码不一致，因为我们使用了不同jqgrid的代码，而且服务器代码不标准（不要使用那些技术）。

致使用 jqgrid 的初学者

请确保您使用的是同一个 jqgrid，这将帮助您保持代码的一致性。在互联网上你可以找到不同版本的 jqgrid，所以首先要确定你是要使用免费版还是商业版，然后再选择最新的。

Answer 1

您的代码中有很多奇怪的东西（在服务器端和客户端）。我不想重写你的代码。在客户端，您只需将相同的postdata 发送到服务器。您只需将数据包装在 Data 参数中并转换为 JSON。

我只是在您的代码中提到了一些明显的问题：

• 您将editUrl 放置在错误的位置，并且您使用了错误的选项名称。 editGridRow 的选项应该是url。 editurl参数的正确位置（！！！不是editUrl！！！）是jqGrid的选项（与colModel、colModel等在同一个位置）。
• 如果您使用内联编辑方法editRow，则应使用serializeRowData 回调和ajaxRowOptions 选项将编辑时发布的数据序列化为JSON（请参阅您的原始文本）。如果您想改用editGridRow 方法（请参阅问题的更新部分），那么您需要使用serializeEditData 而不是serializeRowData。
• 内联编辑方法restoreRow在ondblClickRow回调中的调用在使用表单编辑方法editGridRow的情况下没有意义。在表单编辑的回调beforeSubmit 中使用$('#list').trigger('reloadGrid'); 没有任何意义，因为jqGrid 在编辑后会自动重新加载数据。另一方面，重新加载本地数据（您使用datatype: "jsonstring"）也没有任何意义。
• 您在对问题的评论中写道，您使用的是 jqGrid 4.6，但您使用的 fixPositionsOfFrozenDivs 方法仅存在于 free jqGrid 中。您应该决定要使用哪个 jqGrid 分支并使用相应的选项。如果使用免费的 jqGrid，您可以使用新样式的表单编辑和内联编辑选项（请参阅the wiki article），这可以使您的代码更短且易于阅读。另一方面，这些选项仅适用于免费的 jqGrid。因此，了解您使用的 jqGrid 的哪个分支以及哪个版本非常重要。
• 我建议您使用SqlCommand 的参数 并且从不 直接将SQL 语句构造为字符串（请参阅在您的代码中构建WhereCondition2）。这很危险。
• 您应该永远不要使用在 WebMethod:JavaScriptSerializer serializer = new JavaScriptSerializer(); return serializer.Serialize(gd); 中手动序列化输出数据。这是错的！ ASP.NET 根据 HTTP 请求的 Content-Type 标头自动进行 JSON/XML 序列化。返回数据的类型应该是object而不是字符串（public static string GetDataBySearchCriteria()需要替换为public static object GetDataBySearchCriteria()）。您应该使用return gd; 而不是return serializer.Serialize(gd);。您当前的服务器方法序列化为 JSON 两次。 GetDataBySearchCriteria 或UpdateVolumeData 返回的字符串将被再次序列化。因此，服务器返回类似{"d": "{..., \"some string\"...}"} 而不是{"d": {..., "some string"...}}。 sbcolModel.Append("{\"name\":\"") 和 json.Append("{").Append("\"rows\":") 的用法也很糟糕。正确的代码应该只适用于对象。不需要手动转换 JSON。正因为如此，您需要额外调用JSON.parse 或$.parseJSON。典型的$.ajax 调用在内部将 JSON 数据转换为对象，您可以直接使用 object。这可能是你不使用datatype: "json"和jsonReader: {repeatitems: false}, ajaxGridOptions: { contentType: "application/json" }, serializeGridData: function (postData) { return JSON.stringify(postData); }等的原因。

我可以继续...