Search code examples
jqgridform-editing

jqGrid - form editing issues


In the inline editing, before the editing be made, it creates internally an array (savedRow) and fill it with the values of the fields that are being editable, so I can access this values.

I'd like to know if in the form editing it has something similar to this, because I need to access the values of the fields before the editing will be completed to do a validation before the fields are "saved" in the database.

Someone could help me?


EDITED :

I'm posting here a part of my code (the code of one field), and I'm trying to validate in both way (inline editing and form editing). For inline editing I'm validating using dataEvents and there I'm using savedRow to access the data that were not stored yet. But when I try to edit using form editing because of the the use of savedRow, it shows me an error: savedRow is not defined. In the case of this field the editrules fits with what I want to do, but I don't know if this will occurs in all of those fields.

{ name: 'ac_fd', index: 'ac_fd', width: 50, editable: true,
  formatter: 'number', editrules: { number:true, required:true, minValue: 0.1,
  maxValue: 1.0 }, formatoptions: { decimalPlaces: 1, decimalSeparator: '.'},
     editoptions: {
        dataEvents: [ {
           type: 'blur', fn: function(e) {                        
              var savedrow  = $("#list").getGridParam('savedRow');
              console.log($(this).val());
              if($(this).val() != savedrow[0]['ac_fd']) {         
                 var eid='#' + savedrow[0]['id'] + '_ac_fd';   
                 var val_fd=$(this).val();
                 var fd_min=0.1;
                 var fd_max=1.0;

                 if( isNaN(val_fd) || val_fd > fd_max || val_fd < fd_min) {
                       setTimeout(function(){
                       $(eid).focus().select();
                    },600);


                    $(eid).qtip({
                       content: {
                          text: 'Fator de Demanda deve ser um <b>número</b>
                                 entre <b>' + fd_min.toFixed(1) + '</b> e <b>'
                                 + fd_max.toFixed(1) + '</b>.',
                          title: {
                             text: 'Atenção:',
                             button: true
                          }
                       },
                       show: {
                          event: false,

                          ready: true,

                          effect: function() {
                             $(this).stop(0, 1).fadeIn(400);
                          },

                          delay: 0,
                                                     },
                       hide: {
                          event: false,

                          effect: function(api) {
                             $(this).stop(0, 1).fadeOut(900).queue(function() {
                                 api.destroy();
                             });
                          },
                       },
                       style: {
                          classes: 'qtip-red qtip-rounded trif_tip_err',
                          tip: {
                             width: 10,
                             height:12
                          } 
                       },
                       position: {
                          my: 'bottom left',  
                          at: 'top center',
                       },

                       events: {
                          render: function(event, api) {
                             tip_timer.call(api.elements.tooltip, event);
                          }
                       }
                    });  

                 }       
              }        
           }           
        } ]            
     }                   
  },

So if dataEvents is common and used for the three forms of edit, where can I do this type of validation (using qtip too and I want that this validation be used in inline editing too)?


Solution

  • The reason why jqGrid save the editing row in interval savedRow parameter is because jqGrid modify the editing row in-place. Only because of that inline editing and cell editing use interval savedRow parameter. Form editing don't modifies the original row of grid till the editing will be finished. So no savedRow parameter are used by form editing.

    If the form are closed or if the server response will contains some error HTTP code the new data entered by user will be not saved in the grid. So simple server side validation is typically enough. If you want implement additional client side validation you can use editrules feature. Custom validation is typically enough. It can help validate one field of the form. If you need compare multiple fields of form during validation (if the value of one field defines valid values of another field) then one uses beforeCheckValues callback additionally.

    UPDATED: Inside of fn event handler you can test whether it will be called inside of form editing or not. There are many ways to do this. For example you can test $(e.target).closest(".FormGrid").length > 0. If it's true then the event is inside of form. Additionally it's important to understand that the current editing row is not changed till successful saving on the server. So you can use any time getGridParam with "selrow" option to get the id of editing row and you can use getRowData or getCell to get the data from the grid before modification started (the same as savedrow).