jqGrid setSelection不突出显示行onload答案

【问题标题】：jqGrid setSelection not highlighting row onloadjqGrid setSelection不突出显示行onload
【发布时间】：2016-03-04 00:00:51
【问题描述】：

我将 MVC 模型传递给查看，用 ID 填充隐藏字段，然后我需要相应的行突出显示以显示选择。

我以各种方式尝试了setSelection，但都没有奏效。没有错误。以下是我尝试过的事情：

$("#computer-grid").jqGrid("setSelection", "3");

或

var hardwareId = $("#HardwareId").val();
$("#computer-grid").jqGrid("setSelection", hardwareId);

在loadComplete:

loadComplete: function () {
    $("computer-grid").setSelection(hardwareId, true);
}

在loadComplete 中调用外部函数：

loadComplete: function () {
    showSelectedRow();
}


function showSelectedRow() {
    var hardwareId = $("#HardwareId").val();
    $("computer-grid").setSelection(hardwareId, false);
}

如果有其他选项，我不必使用setSelection。我只想让hardwareId的网格行高亮不为空。

/////编辑/////// 按要求提供的附加信息：

我正在使用从 trirand.com 下载的 jqGrid 4.8.2。我在页面上有 2 个网格。

    var computerGridUrl = $("#CpuFunctionUrl").val();   //window.GetCpuGridUrl();
    var mobileGridUrl = $("#MobileFunctionUrl").val();  //window.GetMobileGridUrl();

    $("#computer-grid").jqGrid({

        url: computerGridUrl,
        datatype: "json",
        colNames: ['Id', 'Type', 'Model', 'Description', 'Price'],
        colModel: [
                { name: "HardwareId", key: true, hidden: true },
                { name: "ItemType", sortable: true},
                { name: "Model", sortable: true },
                { name: "ItemDescription", width: 400 },
                { name: "Price", formatter: "currency", align: "center", sortable: true }
        ],
        loadonce: true,
        height: '200',
        autowidth: true, 
        pager: "#cpu-grid-pager",
        onSelectRow: function (id) {
            SetDeviceId(id);
            UnSelectRow("#mobile-grid");
        },
        loadComplete: function () {
            showSelectedRow();
        }
    });

    $("#mobile-grid").jqGrid({

        url: mobileGridUrl,
        datatype: "json",
        colNames: ['Id', 'Type', 'Model', 'Description', 'Price'],
        colModel: [
                { name: "HardwareId", key: true, hidden: true },
                { name: "ItemType" },
                { name: "Model", sortable: true},
                { name: "ItemDescription", width: 400 },
                { name: "Price", formatter: "currency", align: "center" }
        ],
        loadonce: true,
        height: '200',
        autowidth: true,
        pager: "#mobile-grid-pager",
        onSelectRow: function (id) {
            SetDeviceId(id);
            UnSelectRow("#computer-grid");
        }
    });

function SetDeviceId(id) {
    var deviceId = id;
    if (deviceId > 0) {
        $("#SelectedDevice").val(deviceId);
    }
}

function UnSelectRow(gridName)
{
    $(gridName).jqGrid("resetSelection");
}

function showSelectedRow() {
    var hardwareId = $("#HardwareId").val();
    $("computer-grid").setSelection(hardwareId);
}

///////////////第二次编辑 - 添加 json 字符串响应 /////////////////////p>

这是填充网格的初始数据加载：

[{"HardwareId":1,"Model":"Latitude 14 7000","ItemDescription":"lightweight mobile computer","ItemType":"Lightweight Laptop","IsMobile":false,"IsMiFi":false,"Price":1254.00,"CellularPlan":null,"AppStoreId":null,"SelectedDevice":0,"RequestId":0},{"HardwareId":2,"Model":"Latitude E6540","ItemDescription":"A mobile computer","ItemType":"Standard Laptop","IsMobile":false,"IsMiFi":false,"Price":2096.00,"CellularPlan":null,"AppStoreId":null,"SelectedDevice":0,"RequestId":0},.....]

一旦用户选择了一行，rowid 就会保存到“SelectedDevice”隐藏字段中，该字段位于随后提交给服务器的 FORM 中。网格不在表格内。一切正常。

我现在正在做的是处理如果用户返回此页面会发生什么。这个 Web 应用程序有 6 个视图，每个页面上都有一个表单，有点像向导。如果用户回到这个网格页面，服务器会发送 HardwareId，然后将其存储在隐藏字段“#HardwareId”中。我现在正在尝试的是，当网格填充时，它应该在 HardwareId 隐藏字段中查找一个值，如果有，它应该突出显示网格中的相应行。

所以用户点击后退按钮后，这个隐藏字段会得到一个值：

<input data-val="true" data-val-number="The field HardwareId must be a number." data-val-required="The HardwareId field is required." id="HardwareId" name="HardwareId" type="hidden" value="4" />

【问题讨论】：

您能否提供更详细的信息：您使用的是哪个 jqGrid 版本以及来自哪个分支（free jqGrid、Guriddo jqGrid JS 或版本 id），至少jqGrid的以下选项：datatype，colModel（尤其是id列），multiselect， jsonReader、loadonce 和 prmNames。如果你使用免费的jqGrid，例如，你可以使用multiPageSelection: true
我已按要求添加了更多信息。我不确定您需要了解服务器返回的数据吗？初始网格填充是它使用 MVC 'JsonResult'，所以我相信它是一个 json 字符串。但是，带有hardwareid 的隐藏字段是通过通常的MVC 模型从控制器传递到视图的。唯一会填充此内容的情况是用户进行了选择，继续前进，然后使用返回按钮返回。
你的rowid有问题。您能否包括一个服务器响应的示例（带有两行数据）？输入数据中的HardwareId 值在哪里？
有哪些元素 #HardwareId"`` and #SelectedDevice. You should include idPrefix` 至少有一个网格可以确保页面上没有重复的 id。此外，我建议您尝试将 jqGrid 文件的 URL（至少对于测试）替换为the wiki中描述的免费 jqGrid 4.13.0 的 URL
您应该写简短的评论，以告知其他人您的问题文本的更改。我完全不小心打开了你的老问题。您包含了 JSON 响应的示例。是第一个网格还是第二个网格的数据（来自mobileGridUrl 或来自computerGridUrl）？看来您有两个绝对相同 colModel 的网格，并且可能具有相同的数据。 HardwareId 的值与 <tr> 的 id 相同，并且在网格和 id 重复项中可能相同。而且你在onSelectRow里面调用UnSelectRow，很可疑。

标签： jquery jqgrid jqgrid-asp.net

【解决方案1】：

似乎其中一些应该有效，但不知道为什么。我注意到我的一些示例在网格 ID 调用中缺少井号 (#)，这导致了这个工作代码：

网格定义内部：

        loadComplete: function () {
            showSelectedRow();
        }

然后是函数：

function showSelectedRow() {
    var hardwareId = $("#HardwareId").val();
    $("#computer-grid").jqGrid('setSelection', hardwareId);
}

现在工作。

【讨论】：