Problem with onDblClickRow datagrid event, to open propertygrid

[jmansur]

i want to show an propertygrid with each column of selected row and its value, on onDblClickRow datagrid event

My datagrid Definition
I have one datagrid with 30 columns and only show 22
   Column 1   Frozzen   
   Column 2   Frozzen
   Column 3   Frozzen
   Column 4   Frozzen
   Column 5
   Column 6
   ...
   Column 22
   
My    onDblClickRow event
   onDblClickRow:
            // *************************************************************
            // Abre una window con todas las columnas mostradas en vertical.
            // *************************************************************
            function(index, row){
               var fields = $('#dgSUCURSALES').datagrid('getColumnFields',true).concat($('#dgSUCURSALES').datagrid('getColumnFields',false));
               for(var i=0; i<fields.length; i++){
                  var col = $('#dgSUCURSALES').datagrid('getColumnOption', fields);
                  $('#pgInfoDetalle').datagrid('insertRow', {   index: 1, row :{"name":col.title,"value":'',"group":"ID Settings","editor":"undefined"} });
               }   
               $('#WinInfoDetalle').window('hcenter');   
               $('#WinInfoDetalle').window('vcenter');
               $('#WinInfoDetalle').window('open'); 
            }
            
My first problem
   var fields = $('#dgSUCURSALES').datagrid('getColumnFields',true).concat($('#dgSUCURSALES').datagrid('getColumnFields',false));
   Each field of fields array, not in order of datagrid view.
   why?
   
My second problem   
   How I get de value of each field of fields arrays?
   
Regardsss and excuse me my poor english

[jarry]

The getColumnFields method does return the fields in order of the column definitions. Please show the code of your datagrid column definitions.

[jmansur]

This is my datagrid definition

<table id="dgSUCURSALES" title="REPORTE DE SUCURSALES <%=UCase(f_Tipo)%>" style="width:100%;height:100%">
   <thead data-options="frozen:true">
      <tr>
      <th field="DivDesc"          width="150" align="left" data-options="sortable:true">Division</th>
      <th field="RegDesc"          width="150" align="left" data-options="sortable:true">Region</th>
      <th field="SucCod"             width="100" align="right" data-options="sortable:true,formatter:ProcesaCampoSucursal">Sucursal</th>
      <th field="SucDesc"                   align="left" data-options="sortable:true">Nombre de la Sucursal</th>      
     </tr>
   </thead>
   <thead>   
   <tr>
        <th field="UNDesc"                      align="left" data-options="sortable:true">UNDesc</th>
        <th field="Especializacion"    width="100" align="left" data-options="sortable:true">Especializacion</th>
        <th field="SubEspecializacion"    width="110" align="left" data-options="sortable:true">SubEspecializacion</th>
      <th field="TUNDesc"                   align="left" data-options="sortable:true">TUNDesc</th>
        <th field="DescUE"                      align="left" data-options="sortable:true">DescUE</th>
        <th field="AgenteFinanciero"   width="110" align="center" data-options="sortable:true">AgenteFinanciero</th>
        <th field="DescSucServ"                align="left" data-options="sortable:true">DescSucServ</th>
        <th field="Habilitada"          width="110" align="center" data-options="sortable:true">Habilitada</th>
        <th field="SucOperativa"       width="110" align="center" data-options="sortable:true">SucOperativa</th>      
        <th field="FechaApertura"       width="110" align="right" data-options="">FechaApertura</th>      
        <th field="FechaCierre"       width="110" align="right" data-options="">FechaCierre</th>         
        <th field="Provincia"          width="110" align="left" data-options="sortable:true">Provincia</th>
        <th field="Partido"          width="110" align="left" data-options="sortable:true">Partido</th>
        <th field="Localidad"          width="110" align="left" data-options="sortable:true">Localidad</th>
        <th field="Domicilio"          width="110" align="left">Domicilio</th>
        <th field="CodPostal"          width="110" align="right" >CodPostal</th>
        <th field="Horario"          width="110" align="right" >Horario</th>
        <th field="Telefono"                   align="right" >Telefono</th>
        <th field="Ddn"             width="110" align="right" data-options="">Ddn</th>
        <th field="CajaSeguridad"       width="110" align="center" data-options="sortable:true">CajaSeguridad</th>
        <th field="GerenteSuc"                   align="left" data-options="">GerenteSuc</th>
        <th field="RespOperativo"                align="left" data-options="">RespOperativo</th>      
   </tr>
    </thead>
  </table>

and this is my javascript datagrid definition

   function(){  $('#dgSUCURSALES').datagrid( {
            autoRowHeight:false,
            autoSizeColumn:true,
            collapsible:false,
            fitColumns:false,
            loadMsg: 'Procesando: Aguarde un momento.',
            multiSort:false,               // habilita o sehabilita el multisort del grid
            toolbar: '#tb',               // Establece cual es el toolbar del grid
            nowrap:true,               // SIEMPRE EN TRUE. Todos el contenido de una columna se muestra en una solo fila
            onDblClickRow:
                     // *************************************************************
                     // Abre una window con todas las columnas mostradas en vertical.
                     // *************************************************************
                     function(index, row){
var fields = $('#dgSUCURSALES').datagrid('getColumnFields',true).concat($('#dgSUCURSALES').datagrid('getColumnFields',false));

                        $('#pgInfoDetalle').propertygrid({data: []});
                        
                        for(var i=0; i<fields.length; i++){
                           var col = $('#dgSUCURSALES').datagrid('getColumnOption', fields);
                           $('#pgInfoDetalle').propertygrid('insertRow', {   index: 1, row :{"name":col.title,"value":'',"group":"ID Settings","editor":"undefined"} });
                        }   
                        $('#WinInfoDetalle').window('hcenter');   
                        $('#WinInfoDetalle').window('vcenter');
                        $('#WinInfoDetalle').window('open');  
                     },         
            onHeaderContextMenu:
                     // *****************************************************************************************************************
                     // Habilita el menu para mostros u ocultar columnas con el boton derecho en la cabecera
                     // Se le pasa como parametro el grid y la cantidad de columnas a la izquierda que no se habilitan para ser ocultadas
                     // Las columnas freezadas no se habilitan para se ocultadas
                     // *****************************************************************************************************************
                     function(e, field){
                        e.preventDefault();
                        if (!cmenu){
                           createColumnMenu('#dgSUCURSALES',0);
                        }
                        cmenu.menu('show', {
                           left:e.pageX,
                           top:e.pageY
                        });
                     },
            pageSize:2000,               // Si la vista es bufferview establece el valor de buffer de consulta
            sortable:false,               // Si se habilita el SORT del grid
            //sortName: 'AE_CodSucursal',      // Establece la columna inicial del ordenado del grid
            remoteSort:false,            // siempre false
            remoteFilter:false,            // Siempre flase
            rownumbers:true,            // Si muestra o no el numero de fila del grid
            showFooter:false,            // Siempre false
            singleSelect:true,            // Si premite o no seleccionar mas de una fila
            striped:true               // Pinta una fila en gris y la otra en blanco
         });


when I do double click, the order of the columns of this command is

var fields = $('#dgSUCURSALES').datagrid('getColumnFields',true).concat($('#dgSUCURSALES').datagrid('getColumnFields',false));

Division
RespOperativo
GerenteSuc
CajaDeSeguridad
DDN
telefono
horario
codigopostal
.......
......


thankssss

[jarry]

Please refer to this example http://jsfiddle.net/nu6ryq43/. When double click on a row, the displaying fields are:

DivDesc,RegDesc,SucCod,SucDesc,UNDesc,Especializacion,SubEspecializacion,TUNDesc,DescUE,...

[jmansur]

jarry.

Before all, i want to thank you for your time.

its as you say.

and when i check that you say, I see my error. I neneverrr change de index number

$('#pgInfoDetalle').propertygrid('insertRow', {   index: 1, row :{"name":col.title,"value":'',"group":"ID Settings","editor":"undefined"} });

apologies and anew,  thank you for your time.
best regards