[bozpetMember]

$("#objetives").jqxGrid(
                      {
                          width: '100%',
                         // autoheight: true,         
                         height: '200px',                   
                          source: dataAdapterObjectives,                    
                          theme: theme,
                          columnsresize: true,
                          showstatusbar: true,
                          editable: true,
                          editmode: 'selectedcell',
                          selectionmode: 'singlecell',
                          handlekeyboardnavigation: function(event)
                          {
                              var key = event.charCode ? event.charCode : event.keyCode ? event.keyCode : 0;
                              if (key == 46) {
                                  var cell = $('#objetives').jqxGrid('getselectedcell');
                                  if(cell.datafield == 'mValor'){
                                      $("#objetives").jqxGrid('getrowdata', $("#objetives").jqxGrid('getselectedcell').rowindex).mValor='';
                                      $('#objetives').jqxGrid('refreshdata');
                                      $("#objetives").jqxGrid('updaterow',$("#objetives").jqxGrid('getselectedcell').rowindex, $("#objetives").jqxGrid('getrowdata', $("#objetives").jqxGrid('getselectedcell').rowindex));
                                  }
                                  else  if(cell.datafield == 'mValorPorDefeito'){
                                      $("#objetives").jqxGrid('getrowdata', $("#objetives").jqxGrid('getselectedcell').rowindex).mValorPorDefeito='';
                                      $('#objetives').jqxGrid('refreshdata');
                                      $("#objetives").jqxGrid('updaterow',$("#objetives").jqxGrid('getselectedcell').rowindex, $("#objetives").jqxGrid('getrowdata', $("#objetives").jqxGrid('getselectedcell').rowindex));
                                  }
                                  return true;
                              }
                          },
                          columns: [
                              { text: 'biIndicadorObjectivo', datafield: 'biIndicadorObjectivo',"hidden": "true" },
                              { text: 'iApeIndicador', datafield: 'iApeIndicador',hidden: true },
                             { text: 'Fecha Inicio', datafield: 'dtDataInicio', columntype: 'datetimeinput', cellsformat: 'd/M/yyyy',
                                 createeditor: function (row, column, editor) {
                                     editor.jqxDateTimeInput({ culture: 'en-CA' });
                                 }, width:_Width
                             },
                             /* { text: 'Período', datafield: 'siPeriodo', displayfield: 'NomePeriodo', columntype: 'dropdownlist',
                                  createeditor: function (row, value, editor) {
                                      editor.jqxDropDownList({ source: periodTypesAdapter, displayMember: 'vcDescricao', valueMember: 'siPeriodo' });
                                  }, width:'10%'
                              },*/
                              { text: 'Valor', datafield: 'mValor', align: 'right', cellsalign: 'right', cellsformat: '<%Get_ValueType();%>', columntype: 'numberinput',                                  
                                  createeditor: function (row, cellvalue, editor) {
                                      editor.jqxNumberInput();
                                      //{ digits: 3 }
                                  }, width:_Width
                              },
                               { text: 'Valor por Defecto', datafield: 'mValorPorDefeito', align: 'right', cellsalign: 'right', cellsformat: '<%Get_ValueType();%>', columntype: 'numberinput',                                  
                                   createeditor: function (row, cellvalue, editor) {
                                       editor.jqxNumberInput();
                                       //{ digits: 3 }
                                   }, width:_Width
                               },
                               { text: 'cCodArtigo', datafield: 'cCodArtigo', width:'20%',  "hidden": "true" },
                               { text: 'Articulo', datafield: 'vcNomeArtigo', width:'25%',  cellbeginedit: function (row) {return false;}, "hidden": _ShowArticle},
                               { text: '',cellbeginedit: function (row) {return false;}, datafield: 'OpenArt', cellsrenderer: cellRendererArticle, width:  '50', "hidden": _ShowArticle},
                               { text: 'cTipoTerceiro', datafield: 'cTipoTerceiro', width:'20%',  "hidden": "true" },
                               { text: 'cCodTerceiro', datafield: 'cCodTerceiro', width:'20%',  "hidden": "true" },
                               { text: 'Entidade', datafield: 'vcNomeEntidade', width:'25%',  cellbeginedit: function (row) {return false;}, "hidden": _ShowEntity},
                               { text: '',cellbeginedit: function (row) {return false;}, datafield: 'OpenEnt',  cellsrenderer: cellRendererEntity, width:  '50', "hidden": _ShowEntity},
                          ],
                         renderstatusbar: function (statusbar) {  
                              var container = $("<div style='overflow: hidden; position: relative; margin: 5px;'></div>");
                              var addButton = $("<div style='float: left; margin-left: 5px;'><span style='margin-left: 4px; position: relative; top: -3px;'>Añadir </span></div>");
                              var deleteButton = $("<div style='float: left; margin-left: 5px;'><span style='margin-left: 4px; position: relative; top: -3px;'>Borrar</span></div>");
                              // var updateButton = $("<div style='float: left; margin-left: 5px;'><span style='margin-left: 4px; position: relative; top: -3px;'>Atualizar</span></div>");
                
                              container.append(addButton);
                              container.append(deleteButton);
                              statusbar.append(container);
                              addButton.jqxButton({ theme: theme, width: 60, height: 15 });
                              deleteButton.jqxButton({ theme: theme, width: 65, height: 15 });
                              // updateButton.jqxButton({ theme: theme, width: 65, height: 20 });
                        
                              // add new row.
                              addButton.click(function (event) { 
                                  var rowscount = $("#objetives").jqxGrid('getdatainformation').rowscount;
                                  var selectedrowindex = $("#objetives").jqxGrid('getselectedcell').rowindex;
                                  
                                  $("#objetives").jqxGrid('endrowedit',selectedrowindex, false);
                                  var datarow = generaterowObjective(rowscount-1);
                                  $("#objetives").jqxGrid('addrow', null, datarow);
                             
                              });
                              // delete selected row.
                              deleteButton.click(function (event) {
                                  var selectedrowindex = $("#objetives").jqxGrid('getselectedcell').rowindex;
                                  var rowscount = $("#objetives").jqxGrid('getdatainformation').rowscount;
                                  if (selectedrowindex >= 0 && selectedrowindex < rowscount) {
                                      var id = $("#objetives").jqxGrid('getrowid', selectedrowindex);
                                      $("#objetives").jqxGrid('deleterow', id);
                                  }
                              });
                              statusbar.append(container);
                          },
                      });
                }

Here is the complete code…. some columns hide and show depending of another variable, when i change the variable i run this function:

 function showHideColumns(dimension) {
                if(dimension == "1" ||dimension == "")
                {
                    $("#objetives").jqxGrid('hidecolumn', 'vcNomeArtigo');
                    $("#objetives").jqxGrid('hidecolumn', 'OpenArt');
                    $("#objetives").jqxGrid('hidecolumn', 'vcNomeEntidade');
                    $("#objetives").jqxGrid('hidecolumn', 'OpenEnt');
                }else if(dimension == "2")
                {
                    $("#objetives").jqxGrid('showcolumn', 'vcNomeArtigo');
                    $("#objetives").jqxGrid('showcolumn', 'OpenArt');
                    $("#objetives").jqxGrid('hidecolumn', 'vcNomeEntidade');
                    $("#objetives").jqxGrid('hidecolumn', 'OpenEnt');
                }else if(dimension == "4")
                {
                    $("#objetives").jqxGrid('hidecolumn', 'vcNomeArtigo');
                    $("#objetives").jqxGrid('hidecolumn', 'OpenArt');
                    $("#objetives").jqxGrid('showcolumn', 'vcNomeEntidade');
                    $("#objetives").jqxGrid('showcolumn', 'OpenEnt');
                }else if(dimension == "3")
                {
                    $("#objetives").jqxGrid('showcolumn', 'vcNomeArtigo');
                    $("#objetives").jqxGrid('showcolumn', 'OpenArt');
                    $("#objetives").jqxGrid('showcolumn', 'vcNomeEntidade');
                    $("#objetives").jqxGrid('showcolumn', 'OpenEnt');
                   
                    $("#objetives").jqxGrid('beginupdate');
                    $("#objetives").jqxGrid('setcolumnproperty', 'mValor', 'width', 10);
                    $("#objetives").jqxGrid('setcolumnproperty', 'mValorPorDefeito', 'width', '10px');
                    $("#objetives").jqxGrid('setcolumnproperty', 'dtDataInicio', 'width', '10%');
                    $("#objetives").jqxGrid('endupdate');
                    $("#objetives").jqxGrid('invalidate');
                }
                    
            }

[bozpetMember]

I tried the invalidate and its the same… dont work..

 $("#objetives").jqxGrid('beginupdate');
                    $("#objetives").jqxGrid('setcolumnproperty', 'mValor', 'width', 10);
                    $("#objetives").jqxGrid('setcolumnproperty', 'mValorPorDefeito', 'width', '10px');
                    $("#objetives").jqxGrid('setcolumnproperty', 'dtDataInicio', 'width', '10%');
                    $("#objetives").jqxGrid('endupdate');
                    $("#objetives").jqxGrid('invalidate');

Three different ways to set the width but always the same result… If i set the align og the cell it works, but the width dont work.

[bozpetMember]

Use JSON.stringify(“your data from server here”).

[bozpetMember]

I changed the grid properties
editmode: ‘selectedcell’,
selectionmode: ‘singlecell’,

Is working now… thanks anyway

Best Regards

[Author]

Posts