Problema de selección de Jqgrid con columnas duplicadas

Estoy enfrentando un problema en Jqgrid con la selección de filas. He duplicado filas en la cuadrícula. Cada vez que selecciono el duplicado o selecciono el primer registro de esa fila duplicada.

introduzca la descripción de la imagen aquí

Es un problema común para muchas personas que comienzan a usar jqGrid. Existe un comportamiento de selección tan extraño si llena la cuadrícula con filas que tienen duplicados de ID . Por lo tanto , es extremadamente importante entender cómo jqGrid utilizará los identificadores de su entrada .

jqGrid utiliza el marcado HTML interno para mostrar la cuadrícula. Utiliza

,

(el cuerpo de la tabla – no tiene encabezados de columna),

(fila de la tabla) y

(tabla de la tabla) para cualquier cuadrícula. El fragmento HTML a continuación podría representar su cuadrícula, por ejemplo

 
16A11Add
1ChartEdit
1ChartDelete
1ChartView
15ManageEdit
16A11View
15ManageDelete

El diseño de jqGrid es para que uno pueda tener acceso rápido a cualquier fila de la cuadrícula. Para implementar el acceso rápido, es necesario asignar a cada

(fila de la tabla) un ID único . Encontrará los parámetros de rowid en la mayoría de los métodos o eventos utilizados por jqGrid. El id de la fila debe identificar la fila en el conjunto de las filas de la tabla. En el caso de que la grilla sea como la siguiente.

 
16A11Add
1ChartEdit
1ChartDelete
1ChartView
15ManageEdit
16A11View
15ManageDelete

De acuerdo con la especificación HTML, el ID de cualquier elemento HTML debe ser único en la página . Si asigna identificadores duplicados a las filas como aquí, por ejemplo

 
16A11Add
1ChartEdit
1ChartDelete
1ChartView
15ManageEdit
16A11View
15ManageDelete

La tabla podría seguir mostrándose en la mayoría de los navegadores web, pero el trabajo con la cuadrícula podría ser realmente problemático. Por ejemplo, si selecciona la última fila de dicha cuadrícula, el código jqGrid correspondiente descubrirá 15 como el id. De la fila actual y usará $("#15").addClass("ui-state-highlight") para resaltar la fila actual. En lugar de eso, el código seleccionará (agregue la clase “ui-state-highlight”) solo a la primera fila que tiene id = “15”.

Por lo tanto, debe tener mucho cuidado si llena los datos JSON utilizados como entrada jqGrid. Los siguientes datos, por ejemplo, podrían representar la cuadrícula que contiene:

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

Los datos JSON podrían ser fijados a

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

o para

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

por ejemplo. Entonces el mundo (incluida la cuadrícula) se pondrá bien.