EasyUI Forum
April 27, 2024, 10:15:47 PM *
Welcome, Guest. Please login or register.

Login with username, password and session length
News:
 
   Home   Help Search Login Register  
Pages: [1]
  Print  
Author Topic: Datagrid continue editing row after negative validation check  (Read 3133 times)
gordis gmbh
Full Member
***
Posts: 103


View Profile Email
« on: May 20, 2019, 09:07:55 AM »

I have a datagrid with five columns having checkbox editor. If a row is edited, at least ONE of the five checkboxes must be checked. If not, I want to inform the user "please select a checkbox" while remaining in the editing mode.

How can this be achieved? Currently, the row editing gets ended and the user has to double click to begin the editing again:

Code:
onEndEdit: function (index, rowToSave) {
                if (rowToSave.isNewRecord && atleastOneCheckboxSelected(rowToSave) === false) {
                    showSlideMsg("Please select a checkbox!");
                    return false;
                }
                ... save row ...
}

Thanks for the help.
Logged
stworthy
Administrator
Hero Member
*****
Posts: 3581


View Profile Email
« Reply #1 on: May 20, 2019, 06:59:56 PM »

You can define a hidden field with validatebox editor. When none of the checkbox is checked, set the validatebox editor to empty. This will prevent the datagrid from ending the editing action as the validating result is failure. Please refer to the code below:
Code:
$('#dg').datagrid({
columns: [[
{field:'f1',title:'title1',width:100,editor:{type:'checkbox',options:{on:'On',off:'Off'}}},
{field:'f2',title:'title2',width:100,editor:{type:'checkbox',options:{on:'On',off:'Off'}}},
{field:'f3',title:'title3',width:100,editor:{type:'checkbox',options:{on:'On',off:'Off'}}},
{field:'f4',title:'title4',width:100,editor:{type:'checkbox',options:{on:'On',off:'Off'}}},
{field:'f5',title:'title5',width:100,editor:{type:'checkbox',options:{on:'On',off:'Off'}}},
{field:'h',title:'hidden',hidden:true,width:100,editor:{type:'validatebox',options:{required:true}}}
]],
onBeginEdit: function(index,row){
var f1 = $(this).datagrid('getEditor',{index:index,field:'f1'});
var f2 = $(this).datagrid('getEditor',{index:index,field:'f2'});
var f3 = $(this).datagrid('getEditor',{index:index,field:'f3'});
var f4 = $(this).datagrid('getEditor',{index:index,field:'f4'});
var f5 = $(this).datagrid('getEditor',{index:index,field:'f5'});
var h = $(this).datagrid('getEditor',{index:index,field:'h'});
var c1 = $(f1.target).change(_changeHandler);
var c2 = $(f2.target).change(_changeHandler);
var c3 = $(f3.target).change(_changeHandler);
var c4 = $(f4.target).change(_changeHandler);
var c5 = $(f5.target).change(_changeHandler);
function _changeHandler(){
if (c1.is(':checked')||c2.is(':checked')||c3.is(':checked')||c4.is(':checked')||c5.is(':checked')){
$(h.target).val(true)
} else {
$(h.target).val('')
}
}
}
})
Logged
gordis gmbh
Full Member
***
Posts: 103


View Profile Email
« Reply #2 on: May 20, 2019, 11:55:23 PM »

Brilliant. will try that out. Thanks!
Logged
Pages: [1]
  Print  
 
Jump to:  

Powered by MySQL Powered by PHP Powered by SMF 1.1.18 | SMF © 2013, Simple Machines Valid XHTML 1.0! Valid CSS!