combobox como gridcolumn en ExtJs 4.2. ¿Cuál es la mejor y más importante forma de hacerlo?

1

Tengo un requisito en el que una columna debe ser un cuadro combinado dentro de una cuadrícula.

1er camino dentro de los artículos

items :[{width : 500,
        margin : '5 5 5 5',
        xtype : 'gridpanel',
        store :'some_store_name',
        sortableColumns : false,
        selType : 'cellmodel',
        plugins : [ {
                ptype : 'cellediting',
            clicksToEdit : 1
            } ],
        columns : [ {
                text : '<b>Column_one</b>',
                dataIndex : 'index_one',
                flex : 1
                },
                       {text : '<b>choose a value</b>',
                dataIndex : 'index_two',
                flex : 1,
                editor : {
                    xtype : 'combobox',
                    store : 'some_store_name',
                    queryMode : 'local',
                    displayField : 'label',
                    valueField : 'label'
                    }}]}]

Esto funciona de la manera correcta. El único problema es que el usuario tiene que hacer clic en la cuadrícula para saber que es un cuadro combinado. ¿Debo usar CSS y establecer una propiedad que diga que esta columna en particular dentro de la cuadrícula debería aparecer como un combo? ¿Hay alguna otra manera?

2ª forma En lugar de usar el editor de complementos, podemos usar una función de renderizado y devolver un xtype de combobox que está poblado por una tienda. Si tengo 3 columnas dentro de una cuadrícula y el requisito dice que este combo debería estar en la segunda columna, entonces hay un error. Cuando hago clic en el combo, selecciono un valor y paso a la tercera columna para cambiar un texto o ingresar / editar la columna que es del tipo (cuadro de texto o algún componente), el valor del cuadro combinado desaparece. ¿Por que es esto entonces?

     { dataIndex : 'values', text : '<b>Status</b>',   xtype : 'componentcolumn',
  flex : 2,renderer : function(value) {return { name : 'some_name',store : 'some_store',    value : value,xtype : 'combobox',displayField : 'y',valueField : 'x',   queryMode : 'local'};}}}

Cualquier sugerencia es bienvenida. gracias !

1

Usar la primera forma es correcto. Si desea que la columna también parezca que es editable, consulte mi respuesta a esta pregunta SO: ¿Cómo mostrar la columna completa como editable en la cuadrícula extjs (edición de celda)?

La razón por la que el segundo enfoque no funciona es que el cuadro combinado no está vinculado de ninguna manera a los datos de registro que debería actualizarse. En el renderizado inicial, está configurando el valor predeterminado del cuadro con el valor de los registros a través del renderizador, pero cuando alguien va a editar ese valor, no hay nada que decir: "Oye, actualiza también el registro con este valor". Dado que no hay un enlace definido entre el registro y el cuadro combinado, el cuadro combinado en realidad no le dice al registro el nuevo valor y, por lo tanto, cuando la cuadrícula muestra el valor del registro nuevamente, no hay ningún valor actualizado para mostrar.

2
  • ¿No debería el dataIndex actuar como enlace entre el combo y la cuadrícula?
    MBK
    30/0913 a las 22:34
  • No lo creo. No hay código que forme ese enlace, la única razón por la que se mostraría el valor correcto cuando se representa la columna es porque tiene el valor definido a partir del valor de la función del renderizador. Es una especie de cosa unidireccional.
    Reimius
    1/10/2013 a las 13:24