JqGrid - built-in editing and capture rules

In my situation, I have to allow users to edit various cells in the grid, and then save the entire grid to the server later. I pretty much solved this problem with inline editing and saving in clientArray. However, I am trying to use editRules and ran into some problems.

If I create an editable column and use edit rules to require its number

{ name: 'Value', index: 'Value', width: 50, sortable: true,edittype: 'text', editable: true, editoptions: { maxlength: 10 }, editrules:{number: true}, formatter:currencyFmatter, unformat:unformatCurrency }, 

and I control editing and saving in the onSelectRow event:

 onSelectRow: function(id){ if(id && id!==lastSel){ jQuery("#Groups").saveRow(lastSel,true,'clientArray'); jQuery("#Groups").editRow(id,true); } lastSel=id }, 

Then I use the button click event to save the grid. Everything works fine until I add a numerical value to the Value cell, and then click on the line below. He throws a warning and stops saving, but that does not stop me from changing lines. Therefore, I now have two lines for editing. Is there a way to catch an editrule error so that I can handle it before moving on to the next line.
I tried using functions with saveRow (succesfunc, aftersavefunc, errorfunc, afterrestorefunc), of which everyone says that fire after saving data to a server, which does not seem to work for 'clientArray.

Basically, I need to find a way to verify the data in the built-in editing while saving the information, sentences, and, in particular, the examples will be highly appreciated in the clientArray.

Thanks.


After a long game, I decided that the editing rules did not work so well with InLine Editing. So, as you suggested, I made my own verification procedure. The trick was to figure out how to get the value of the edited row.

The only thing I'm trying to understand now is how to get focus in order to return to the Value column. Go back to the documentation!

  if(id && id!==lastSel){ //dont save if first click if (lastSel != -1) { //get val of Value to check var chkval = jQuery("#"+lastSel+"_Value").val() ; // verify it is a number if (isNaN(chkval)) {//If not a number //Send Validation message here //Restore saved row jQuery("#Grid").restoreRow(lastSel); //Return to failed save row jQuery("#Grid ").setSelection(lastSel,false); //reopen for editing jQuery("#Grid ").editRow(lastSel,true); //Note - dont reset lastSel as you want to stay here } else { // If number is good, proceed to save and edit next jQuery("#Grid ").jqGrid('saveRow',lastSel, checksave, 'clientArray', {}, null, myerrorfunc); jQuery("#Grid ").editRow(id,true); lastSel=id; }; isDirty = true; }; else { //first click - open row for editing alert("new Edit") jQuery("#Grid ").editRow(id,true); lastSel=id;} } 
+4
source share
5 answers

To solve this problem, I used the jquery.limitkeypress.min.js plugin.

 onSelectRow: function(id){ if(id && id!==lastsel){ jQuery('#treegrid').jqGrid('restoreRow',lastsel); jQuery('#treegrid').jqGrid('editRow',id, true); $("input[name=Presupuesto]").limitkeypress({ rexp: /^[+]?\d*\.?\d*$/ }); lastsel=id; } } 

where "Presupuesto" is the name of the column in which I enter data to the user.

It works very well ...

+4
source

To take care of this, you can program your own validation function, myRowIsValid in the example below. Then just call this function as part of the onSelectRow event onSelectRow :

 onSelectRow: function(id){ if(id && id!==lastSel){ if (lastSel != null && !myRowIsValid(lastSel) ) { // Display validation error somehow return; } jQuery("#Groups").saveRow(lastSel,true,'clientArray'); jQuery("#Groups").editRow(id,true); } lastSel=id }, 

Basically, if the check fails, inform the user and do not edit the next line.

+2
source

I created an array called edit_list, and in the oneditfunc callback I add rowid to the list and on aftersavefunc I remove it from the list.

So you can check edit_list in callbacks to determine if there is an editable line.

+1
source

This solution probably did not exist when the OP first asked, but that is how I solved it using the latest jqGrid version (4.4.4).

I use the fact that saveRow will return true / false on success.

Hope this helps.

 function StartEditing($grd, id) { var editparameters = { "keys": true, "url": 'clientArray' }; $grd.jqGrid('editRow', id, editparameters); $grd[0].LastSel = id; } onSelectRow: function(id) { var $grd = $(this); if (id && !isNaN($grd[0].LastSel) && id !== $grd[0].LastSel) { if ($grd.jqGrid('saveRow', $grd[0].LastSel, { "url": 'clientArray' })) StartEditing($grd, id); else $grd.jqGrid('setSelection', $grd[0].LastSel); } else StartEditing($grd, id); } 
0
source

To block the edit rules for the saveRow event, you can use the built-in return type "saveRow". Please mark as an answer if you are looking for this yourcode : onSelectRow: function(id){ if(id && id!==lastSel){ jQuery("#Groups").saveRow(lastSel,true,'clientArray');
jQuery("#Groups").editRow(id,true); }
lastSel=id }
yourcode : onSelectRow: function(id){ if(id && id!==lastSel){ jQuery("#Groups").saveRow(lastSel,true,'clientArray');
jQuery("#Groups").editRow(id,true); }
lastSel=id }

modify code:

  onSelectRow: function(id){ if(id && id!==lastSel){ var bool = jQuery("#Groups").saveRow(lastSel,true,'clientArray'); //bool true -->success,false -->invalid row /req field validations if(bool) { //Returns true on sucessful save of record ie to grid (when using client array) //and set current selected row to edit mode jQuery("#Groups").editRow(id,true); } else { //Set last selected row in edit mode and add required values jQuery("#Groups").editRow(lastSel,true); } } lastSel=id } 

code>

0
source

Source: https://habr.com/ru/post/1302798/


All Articles