Question

我在Jqgrid中遇到了行选择问题。我在网格中有重复的行。每当我选择副本或选择该重复行的第一条记录时。

enter image description here

Answer 1

对于许多开始使用jqGrid的人来说，这是常见的问题。如果使用 id duplicates 的行填充网格，则存在这种奇怪的选择行为。因此了解jqGrid 将如何使用输入中的ID非常重要。

jqGrid使用内部HTML标记来显示网格。它使用<table>，<tbody>（表的主体 - 没有列标题），<tr>（表的行）和<td>（表的表）任何网格。下面的HTML片段可以代表您的网格，例如

<table>
    <tbody>
        <tr><td>16</td><td>A11</td><td>Add</td></tr>
        <tr><td>1</td><td>Chart</td><td>Edit</td></tr>
        <tr><td>1</td><td>Chart</td><td>Delete</td></tr>
        <tr><td>1</td><td>Chart</td><td>View</td></tr>
        <tr><td>15</td><td>Manage</td><td>Edit</td></tr>
        <tr><td>16</td><td>A11</td><td>View</td></tr>
        <tr><td>15</td><td>Manage</td><td>Delete</td></tr>
    </tbody>
</table>

jqGrid的设计使得人们可以快速访问网格的任何行。要实现快速访问，需要为每个<tr>（表格行）分配一个唯一ID 。您会在jqGrid使用的methods或events中找到最多的rowid参数。行的id应该标识表的行集中的行。在这种情况下，网格将如下所示

<table>
    <tbody>
        <tr id="a"><td>16</td><td>A11</td><td>Add</td></tr>
        <tr id="b"><td>1</td><td>Chart</td><td>Edit</td></tr>
        <tr id="c"><td>1</td><td>Chart</td><td>Delete</td></tr>
        <tr id="abc"><td>1</td><td>Chart</td><td>View</td></tr>
        <tr id="1"><td>15</td><td>Manage</td><td>Edit</td></tr>
        <tr id="2"><td>16</td><td>A11</td><td>View</td></tr>
        <tr id="35"><td>15</td><td>Manage</td><td>Delete</td></tr>
    </tbody>
</table>

根据HTML规范，任何HTML元素的ID在页面上必须是唯一的。如果您确实为这些行指定了重复的ID，例如

<table>
    <tbody>
        <tr id="16"><td>16</td><td>A11</td><td>Add</td></tr>
        <tr id="1"><td>1</td><td>Chart</td><td>Edit</td></tr>
        <tr id="1"><td>1</td><td>Chart</td><td>Delete</td></tr>
        <tr id="1"><td>1</td><td>Chart</td><td>View</td></tr>
        <tr id="15"><td>15</td><td>Manage</td><td>Edit</td></tr>
        <tr id="16"><td>16</td><td>A11</td><td>View</td></tr>
        <tr id="15"><td>15</td><td>Manage</td><td>Delete</td></tr>
    </tbody>
</table>

该表仍然可以在大多数Web浏览器中显示，但使用网格可能确实存在问题。例如，如果您选择此类网格的最后一行，则相应的jqGrid代码将找出15作为当前行的ID，并使用$("#15").addClass("ui-state-highlight")突出显示当前行。而不是代码将选择（将类“ui-state-highlight”）添加到第一行，其id =“15”。

因此，如果填充用作jqGrid输入的JSON数据，则应该非常小心。以下数据例如，可以表示网格包含：

{
    "total": 1,
    "page": 1,
    "records": 7,
    "rows": [
        { "id": "16", "cell": ["16", "A11", "Add"] },
        { "id": "1", "cell": ["1", "Chart", "Add"] },
        { "id": "1", "cell": ["1", "Chart", "Delete"] },
        { "id": "1", "cell": ["1", "Chart", "View"] },
        { "id": "15", "cell": ["15", "Manage", "Delete"] },
        { "id": "16", "cell": ["16", "A11", "View"] },
        { "id": "15", "cell": ["15", "Manage", "Edit"] }
    ]
}

JSON数据可以修复为

{
    "total": 1,
    "page": 1,
    "records": 7,
    "rows": [
        { "id": "1", "cell": ["16", "A11", "Add"] },
        { "id": "2", "cell": ["1", "Chart", "Add"] },
        { "id": "3", "cell": ["1", "Chart", "Delete"] },
        { "id": "4", "cell": ["1", "Chart", "View"] },
        { "id": "5", "cell": ["15", "Manage", "Delete"] },
        { "id": "6", "cell": ["16", "A11", "View"] },
        { "id": "7", "cell": ["15", "Manage", "Edit"] }
    ]
}

或

{
    "total": 1,
    "page": 1,
    "records": 7,
    "rows": [
        { "id": "16_Add", "cell": ["16", "A11", "Add"] },
        { "id": "1_Add", "cell": ["1", "Chart", "Add"] },
        { "id": "1_Delete", "cell": ["1", "Chart", "Delete"] },
        { "id": "1_View", "cell": ["1", "Chart", "View"] },
        { "id": "15_Delete", "cell": ["15", "Manage", "Delete"] },
        { "id": "16_View", "cell": ["16", "A11", "View"] },
        { "id": "15_Edit", "cell": ["15", "Manage", "Edit"] }
    ]
}

例如，

。然后世界（包括网格）将变得可以。

带有重复列的Jqgrid选择问题

1 个答案: