重複列のJqgrid選択問題

Question

行選択を伴うJqgridの問題に直面しています。グリッドに行が重複しています。 私は重複を選択するか、その重複する行の最初のレコードを選択するたびに。

Answer 1

それはjqGridの使用を開始する多くの人々のための共通の問題です。グリッドにの重複したの行があると、そのような奇妙な選択動作が発生します。したがって、は、入力からのIDがjqGridによってどのように使用されるかを理解することが非常に重要です。

jqGridグリッドを表示するために内部的にHTMLマークアップを使用します。これは<table>,<tbody>（表の本体には列ヘッダーがありません）、<tr>（表の行）、および<td>（表の表）を使用しています。 HTMLフラグメントは、以下のいずれかが、グリッドの任意の行からの迅速なアクセスを持つことができるようにjqGridのデザインがある例

<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> 

のためにあなたのグリッドを表すことができます。クイックアクセスを実装するには、<tr>（テーブル行）にの一意のIDを割り当てる必要があります。 jqGridによって使用される最も多くのmethodsまたはeventsのROWIDパラメータが見つかります。行のIDはとなります。テーブルの行セット内の行。場合は、グリッドは、任意のHTML要素のIDがページ上で一意でなければなりませんHTMLの仕様によると、以下の

<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> 

のようになります。あなたが例

<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> 

表はこちらのような行に重複したIDを割り当てない場合は、まだほとんどのWebブラウザで表示することができますが、グリッドでの作業は本当に問題である可能性があります。たとえば、そのようなグリッドの最後の行を選択すると、対応するjqGridコードは現在の行のIDとして15を見つけ、現在の行を強調表示するのに$("#15").addClass("ui-state-highlight")を使用します。その代わりに、コードはの最初の行（id = "15"）にのみ選択します（クラス "ui-state-highlight"を追加します）。

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"] } 
    ] 
} 

にに固定することができます。それから、世界（グリッドを含む）はOKになります。