Formateador jqgrid 4.5.4: seleccione no trabajar para valores duplicados en el cuadro combinado

Estoy usando jqGrid 4.5.4 para construir un jqGrid. Tengo problemas en la edición de combobox. Mi combobox tiene nombres de ciudades. En el cuadro combinado hay dos ciudades con el mismo nombre pero diferentes valores clave. Al editar una fila en jqgrid desplegable se rellenó con la ciudad de valor kay diferente. Utilicé el formatter:'select' . Pero no está funcionando.

Mi código es el siguiente:

 var jQuery = $.noConflict(); var lastSel = 0; jQuery(document).ready(function(){ jQuery.ajax({ // The link we are accessing. url: , // The type of request. type: "get", // The type of data that is getting returned. dataType: "json" }).done(function(data){ jQuery("#list2").jqGrid({ url:, datatype:"json", mtype:"POST", colNames:['localityId','City','Locality'], colModel:[ { name:'localityId', index:'localityId', width:240, key:true, editrules:{edithidden:false, required:true}, editable:true, hidden:true }, { name:'cityId', index:'cityId', width:240, editable:true, edittype:'select', formatter:'select', sortable:true, editrules:{ required:true}, editoptions: { value: data } }, { name:'locality', index:'locality', width:240, sortable:true, editable:true, edittype:'text' } ], rowNum:10, rowList:[10,20,30], pager: '#pager2', sortname: 'locality', editurl:, viewrecords: true, multiselect: true, sortorder: "desc", caption:"Locality Master" }); jQuery("#list2").navGrid( '#pager2', {add:true, edit:true, del:true}, {}, {}, {}, {} ); }); }); 

Si se elimina formatter = ‘select’, entonces cityId se muestra en la pantalla y luego, si se edita la fila, se selecciona la ciudad correcta en el menú desplegable. ¿Cuál es el problema con formatter = ‘select’ y editoption.

Podría reproducir el problema que describiste. El problema está claro: jqGrid usa el formatter: "select" que reemplaza los valores (como 2 , 4 , 35 ) a las cadenas que se guardarán en la celda de la cuadrícula (en

). La celda no tiene información sobre el valor original de seleccionar.

introduzca la descripción de la imagen aquí

Por lo tanto, simplemente llama al formateador del formateador “seleccionar” en la inicialización de la edición del formulario. Si tiene el mismo texto para diferentes valores de selección, entonces el formato no estándar no puede distinguir tanto “Mollem” que tienen valores originalmente diferentes 2 como 35 . Por lo tanto, el formato no devuelve siempre el primer valor encontrado: `2.

No estoy familiarizado con la geografía de la India, pero puedo imaginar que existen dos ciudades diferentes con el mismo nombre. Le recomendaría que tenga diferentes textos para selecciones para que el usuario pueda borrar y ver cuál es el “Mollem” elegido. En el otro lado, se podría incluir “Mollem” diferente en el grupo de opciones diferentes ( ). En el caso, el problema será exactamente igual que en su pregunta original.

Describí en la respuesta cómo se pueden asignar atributos de data a la fila (

) para guardar información adicional personalizada. Sugiero usar el mismo enfoque con las celdas (

). Quiero que la cuadrícula se vea como

introduzca la descripción de la imagen aquí

El código correspondiente es muy fácil. Uno puede definir la columna cityId algo como

 { name: "cityId", formatter: "select", edittype: "select", editrules: { required: true }, editoptions: { value: data }, cellattr: function (rowId, value, rawObject, cm, rdata) { return ' data-val="' + rawObject.cityId + '"'; }, unformat: function (cellText, options, $cell) { return String($cell.data("val")); } } 

Además, sobrescribo el formato sin formato del formatter: select con mi implementación personalizada que obtenga el valor directamente del atributo data-val : String($cell.data("val")) .

La demostración (puede compararla con otra demostración con el problema original) utiliza además dataUrl: "ManOptGroup.htm" con ManOptGroup.htm :

  

Mejora la visibilidad de la selección solo para hacer más fácil distinguir ambos Mollem . La forma de edición resultante se ve ahora como

introduzca la descripción de la imagen aquí