Print Page - Serverside validation and editable datagrid

Title: Serverside validation and editable datagrid
Post by: Onegin on July 14, 2011, 10:26:47 AM

Is it possible to return false status to editable datagrid in server response?
When I create a new record, I use serverside validation for additional checks (e.g. duplicity of the item etc.)
I however didnt find anything in documentation, if there are any return values which save/update/destroy calls listen to.

Title: Re: Serverside validation and editable datagrid
Post by: stworthy on July 14, 2011, 07:44:58 PM

Use the remote validatebox to do server side validation, the code looks like this:

Code:

{field:'name',title:'Your Title',width:100,
editor:{
  type:'validatebox',
  options:{
    required:true,
    validType:'url["dovalidate.php","name"]'
  }
}
}

The server side validate logic:

Code:

$name = $_REQUEST['name'];
//your validate code here
echo 'true'; // return true if validate successfully

Another way to do remote validation is to validate before end your editing.

Code:

var ed = $('#tt').datagrid('getEditor',{index:2,field:'name'}); // get the editor
var v = $(ed.target).val(); // get the field value
// do validate now
$.post('...',{name:v},function(result){
  if (result.success){
    $('#tt').datagrid('endEdit',2); // end editing
  }
});

Title: Re: Serverside validation and editable datagrid
Post by: Onegin on July 15, 2011, 06:39:56 AM

The first way does not work with combobox. It always sends textValue to the server, not the fieldValue and I cant handle returned error message to show it to user.

The other way looks more flexible, but I was simply not able to find out, which event should I put it in...onBeforeEdit seems to be too early, onAfterEdit is already late...

I use $('#tt').edatagrid('saveRow'); call from toolbar button, I can probably do it this way:
handler:function(){
//validation code

$('#tt').edatagrid('saveRow');
}
but still I cant validate before new row is created automatically without user actually clicked on "Save" button. If user clicks on "Create" button, the currently edited row is sent to server without validation. And returning false, onSave event, seems not to stop row from being sent to server...I guess, it is needed to have onBeforeSave event.

Title: Re: Serverside validation and editable datagrid
Post by: stworthy on July 15, 2011, 08:10:32 PM

If use 'edatagrid' plugin, add 'onBeforeSave' event is a good idea.

Usage Example:
$('#tt').edatagrid({
  onBeforeSave:function(index){
   // do the row(index) validate
   return false; // return false to prevent editing action
  }
});

Title: Re: Serverside validation and editable datagrid
Post by: Onegin on July 16, 2011, 02:12:19 AM

Indeed. Does it mean you are going to include it in some future release?

Title: Re: Serverside validation and editable datagrid
Post by: stworthy on July 17, 2011, 06:38:45 PM

The edatagrid plugin is an extension of standard library, see http://www.jeasyui.com/extension/edatagrid.php for more details.

Title: Re: Serverside validation and editable datagrid
Post by: Onegin on July 18, 2011, 02:02:20 AM

Ah, it is already updated :) nice...

Anyways, I have now problem to retrieve data of all editors in a row inside onBeforeSave(), so I can sent it to server in an post array...
I tried:

Code:

onBeforeSave: function(index){
    $('#tt').edatagrid('endEdit', index);
    var changes = $('#tt').edatagrid('getChanges');
}

but it seems that call endEdit triggers saving of the data to the server regardless what is defined in
onBeforeSave

Title: Re: Serverside validation and editable datagrid
Post by: stworthy on July 19, 2011, 12:16:29 AM

Call 'endEdit' method will finish editing action and the row data will be posted to server. In this case, you can get all the editing field value and do some validation:

Code:

onBeforeSave:function(index){
	var nameEditor = $('#tt').edatagrid('getEditor',{index:index,field:'name'});
	var countryEditor = $('#tt').edatagrid('getEditor',{index:index,field:'country'});
	var nameValue = $(nameEditor.target).val(); // get name field value
	var countryValue = $(countryEditor.target).combobox('getValue'); // get country field value, notice that the editor type is combobox
	// do validation about name and country field
	return false; // valiate failure
}

Title: Re: Serverside validation and editable datagrid
Post by: Onegin on July 19, 2011, 04:42:03 AM

Thank you very much for help and update.
$(nameEditor.target) was the tricky part...:)

EasyUI Forum

General Category => EasyUI for jQuery => Topic started by: Onegin on July 14, 2011, 10:26:47 AM