I do not know how to do it.

Regardss

this is my code

                                           <select id="cbgridSucursal"
                                                 class="easyui-combogrid"
                                                 style="width:250px"
                                                 data-options="   panelWidth: 500,
                                                            idField: 'Codigo',
                                                            textField: 'Nombre',
                                                            url: 'Ajax/get_cbox_Sucursales.asp',
                                                            method: 'get',
                                                            columns: [[
                                                               {field:'Codigo',title:'Codigo',width:40},
                                                               {field:'Nombre',title:'Nombre',width:120},
                                                               {field:'Localidad',title:'Localidad',width:150}
                                                            ]],
                                                            fitColumns: true,
                                                             onLoadSuccess: function(){  $(this).combogrid('enableFilter');    }
                                                ">
                                             </select>

Hi.

I try using this solution in a datagrid - bufferview , but when I exported the records, I only exported the amount of the pageSize property records .

It's happened ?

[I)]

Hi.

I have some questions for them .

In datagrids with many columns , I have programmed the onDblClickRow event , showing all columns in the selected row , as rows in a PropertyGrid .

Enquiries:

I) Only the first time the propertygrid window opens , showing the horizontal scroll bar . should never show .

II) Can I get datagrid column formatter method for use as a formatter in the PropertyGrid ?

III) if the heigth of number of rows that show in the PropertyGrid , is less than the vertical height of the window, can  I reduce the height of the window?



onDblClickRow: function(index, row){
// *************************************************************
// Abre una window con todas las columnas mostradas en vertical.
// *************************************************************
       MostrarRegistroCompleto( index, row,  'Datos de la Sucursal', 'dgINCIDENTES' );
},



function MostrarRegistroCompleto( index, row, pWinTitulo, pIdDG ){
// *************************************************************************************************
// si es la primera vez que se solicita esta informacion agrego el div del Window y el propertygrid al BODY
// *************************************************************************************************
      if( typeof WinDiv == 'undefined' ) {
         var idWin = pIdDG + '_WinInfoDetalle';
         var idPg  = pIdDG + '_PgInfoDetalle';
         var WinDiv = $('<div id="'+idWin+'"></div>').appendTo('body');
         var pgTable=$('<table id="'+idPg+'" data-options="fit:true"></table>').appendTo(WinDiv);
         idWin = '#' + idWin;
         idPg  = '#' + idPg;
      }   
      
      // **************
      // Creo la window
      // **************
      $(idWin).window({
         closed:true,
         modal:true,
         title:pWinTitulo,
         collapsible:false,
         minimizable:false,
         maximizable:false,
         width:'50%',
         height:'80%'
      });
      
      // *****************************
      // Obtengo las columnas del Grid
      // *****************************
      pIdDG = '#' + pIdDG;
      var fields = $(pIdDG).datagrid('getColumnFields',true).concat($(pIdDG).datagrid('getColumnFields',false));

      // ***************************************
      // Elimino los elementos del property grid
      // ***************************************
      $(idPg).propertygrid({
         data: [],         // Elimino los elementos del property grid
         showGroup:false,   // No muestro los grupos
         fitColumns:true,   // hago que las columnas abarquen todo el ancho del panel
         fit:true,         // hago que el propertygrid encaje en toda la window
         columns: [[         // Determino los anchos de las dos columnas
            {field:'name',title:'',width:'35%',align:'right',resizable:false,styler:function(value,row,index){ return 'background-color:#F4F4F4;color:black;font-weight: bold;'; } },
            {field:'value',title:'',width:'65%',resizable:false}
         ]]
      });
      
      // ******************************************************
      // cargo los nuevos valores de la nueva fila seleccionada                        
      // ******************************************************
      var RowFieldValue="";
      for(var i=0; i<fields.length; i++){
         var col = $(pIdDG).datagrid('getColumnOption', fields);
         RowFieldValue='row.'+fields;
         $(idPg).propertygrid('insertRow', {   index: i, row :{"name":col.title+': ',"value":eval(RowFieldValue),"group":"ID Settings","editor":"undefined"} });
      }   
      // *****************
      // muestro la window
      // *****************
      $(idWin).window('hcenter');   
      $(idWin).window('vcenter');
      $(idWin).window('open'); 
}

[toExcel]

Hi.

I want to share with you, my export to excel method.

Regardssssss

   // ******************************************************************************
   // Extiende la fucnionalidad de un datagrid para que exporte a excel
   // ******************************************************************************   
   $.extend($.fn.datagrid.methods, {
    toExcel: function(jq, filename){
        return jq.each(function(){
            // *****************************************************************
            // Remueve y agrega un formulario al BODY con los siguientes campos
            //   REP_FILENAME : Nombre del archivo a exportar
            //   REP_TITULOS  : Nombre de las columnas
            //    REP_DATOS    : TextArea donde se almacenan los datos de datagrid
            // *****************************************************************
            $('#idDescargar').remove();
            var strForm = '<form id="idDescargar" action="descargar.asp" method="post"><input type="text" name="REP_EASYUI" value="SI"><input type="text" id="REP_FILENAME" name="REP_FILENAME" value=""><input id="REP_TITULOS" type="text" name="REP_TITULOS" value=""><textarea  id="REP_DATOS" name="REP_DATOS" cols="" rows=""></textarea></form>';
            var WinDiv = $(strForm).appendTo('body');
            
            // *****************************************   
            // Toma los nombres de las columnas del GRID
            // *****************************************
            var Titulos = $(this).datagrid('getColumnFields',true).concat($(this).datagrid('getColumnFields',false));
            
            // ***************************
            // Separador de los datos
            // ***************************
            var RepTitulos = Titulos.join(';');
            
            // ***************************
            // Toma los datos del datagrid
            // ***************************
            var data = $(this).datagrid('getData');
            var strRow = '';
            for(var i=0; i<data.rows.length; i++){
               row = data.rows;
               for(var j=0; j<Titulos.length; j++){
                  if( typeof Titulos[j] == 'undefined' )
                     col = '""';
                  else    
                     col = '"' + row[Titulos[j]].replace(/"/g, '""') + '"';
                     
                  strRow = strRow + col + ';';
               }   
               strRow = strRow + String.fromCharCode(13);
            }
            
            // ***************************
            // Completa los campos
            // ***************************
            $('#REP_FILENAME').val(filename);
            $('#REP_TITULOS').val(RepTitulos);
            $('#REP_DATOS').val(strRow);
            
            // ***************************
            // Submit del formulario
            // ***************************
            $("#idDescargar").submit();
        })
    }
   });
   
   
   
   
descargar.asp   
<%
   strFileName = Request.Form("REP_FILENAME")

   Response.ContentType = "application/csv"
   Response.AddHeader "Content-Disposition", "attachment;filename="&strFileName&";"

   REP_TITULOS = Request.Form("REP_TITULOS")
   REP_DATOS = Request.Form("REP_DATOS")

   Response.Write( REP_TITULOS )
   Response.Write(CHR(13))
   Response.Write( REP_DATOS )
   Response.Write(CHR(13))

   response.End()
%>

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

[This is my datagrid definition]

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

[My datagrid Definition]

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

I need to frozen columns fields of datagrid at run time.

it is possible?

Regardsssssssssss

[function EstiloEtiquetas(value, rowData, index){]

I set styler function but dont create de propertygrid.

why?

Best regardsss.

   function EstiloEtiquetas(value, rowData, index){
         return 'background-color:F0F0F0';
   }
   
   $('#pgSucursal').propertygrid({
       data: <%=sRow%>,
       width: '98%',
       showGroup: true,
       showHeader:true,
            scrollbarSize: 0,
       groupFormatter: FormatearGrupo,
       columns: [[
                        {field:'name',title:'',width:200,resizable:false,formatter:FormateaEtiqueta,styler=EstiloEtiquetas},
         {field:'value',title:'',width:400,resizable:false,formatter:FormateaValor}
           ]]
   });

Thanksssssssssssssssssssssssss

Hi.

Can I put an image into the PropertyGrid Value field?

Best regardssss

spectacular.
thank you.
Best Regardsss

createColumnMenu();

Hi.

You neet to use the onHeaderContextMenu of datagrid.
I use this option for show and hide columns.

and change de code of menu basic.
http://www.jeasyui.com/demo/main/?plugin=Menu&theme=default&dir=ltr&pitem=

Regardssss


onHeaderContextMenu:
               // Muestro u Oculta columnas
               function(e, field){
                  e.preventDefault();
                  if (!cmenu){ createColumnMenu(); }
                  cmenu.menu('show', { left:e.pageX,top:e.pageY } );
JAVASCRIPT FUNCTION
        var cmenu;
   function createColumnMenu(){
      cmenu = $('<div/>').appendTo('body');
      cmenu.menu({
         onClick: function(item){
            if (item.iconCls == 'icon-check_16'){
               $('#tt').datagrid('hideColumn', item.name);
               cmenu.menu('setIcon', { target: item.target, iconCls: 'icon-ver_ocultar_16'   });
            } else {
               $('#tt').datagrid('showColumn', item.name);
               cmenu.menu('setIcon', {   target: item.target, iconCls: 'icon-check_16'   });
            }
         }
      });
      var fields = $('#tt').datagrid('getColumnFields');

      // Arranco de 1 para evitar que me proponga para ocultar la columna que muestra los nodos
      for(var i=0; i<fields.length; i++){
         var field = fields;
         var col = $('#tt').datagrid('getColumnOption', field);
         cmenu.menu('appendItem', { text: col.title,   name: field, iconCls: 'icon-check_16'   });
      }
   }   
},

I have this toolbar in my datagrid.
                                {
               id:'idExportarExcel',
               text: 'Exportar a Excel',
               iconCls: 'icon-excel_16',
               handler: function(){
                     window.open( $('#tt').html());
                     window.open('data:application/vnd.ms-excel,' + $('#tt').html());
               }
            },
            {
               id:'idOrdenarPor',
               text: 'Ordenar Por',
               iconCls: 'icon-ordenar_16',
               handler: function(){alert('Ordenar Por')}
            }

I need to change the iconCls propertie of id:'idExportarExcel' at runtime