Forum
10:00
22/04/2010
I created a muti-checkbox form element, and thought I'd share. This was built using version 3.6.4. If anyone has a more efficient solution, please pass it on.
Within the colModel, the appropriate edit fields look like this:
edittype:'custom'
editoptions:{ custom_element:MultiCheckElem, custom_value:MultiCheckVal, list:'Check1,Check2,Check3,Check4' }
Here are the javascript functions (BTW, It also works - with some modifications - when the list of checkboxes is in a DIV block):
//------------------------------------------------------------
// Description:
// MultiCheckElem is the "custom_element" function that builds the custom multiple check box input
// element. From what I have gathered, jqGrid calls this the first time the form is launched. After
// that, only the "custom_value" function is called.
//
// The full list of checkboxes is in the jqGrid "editoptions" section "list" tag (in the options
// parameter).
//------------------------------------------------------------
function MultiCheckElem( value, options )
{
//----------
// for each checkbox in the list
// build the input element
// set the initial "checked" status
// endfor
//----------
var ctl = '';
var ckboxAry = options.list.split(',');
for ( var i in ckboxAry )
{
var item = ckboxAry[i];
ctl += '<input type="checkbox" ';
if ( value.indexOf(item + '|') != -1 )
ctl += 'checked="checked" ';
ctl += 'value="' + item + '"> ' + item + '</input><br /> ';
}
ctl = ctl.replace( /\<br \/\>\ $/, '' );
return ctl;
}
//------------------------------------------------------------
// Description:
// MultiCheckVal is the "custom_value" function for the custom multiple check box input element. It
// appears that jqGrid invokes this function the first time the form is submitted and, the rest of
// the time, when the form is launched (action = set) and when it is submitted (action = 'get').
//------------------------------------------------------------
function MultiCheckVal(elem, action, val)
{
var items = '';
if (action == 'get') // the form has been submitted
{
//----------
// for each input element
// if it's checked, add it to the list of items
// endfor
//----------
for (var i in elem)
{
if (elem[i].tagName == 'INPUT' && elem[i].checked )
items += elem[i].value + ',';
}
// items contains a comma delimited list that is returned as the result of the element
items = items.replace(/\,$/, '');
}
else // the form is launched
{
//----------
// for each input element
// based on the input value, set the checked status
// endfor
//----------
for (var i in elem)
{
if (elem[i].tagName == 'INPUT')
{
if (val.indexOf(elem[i].value + '|') == -1)
elem[i].checked = false;
else
elem[i].checked = true;
}
} // endfor
}
return items;
}
17:50
12/11/2009
Nice work, but how do you bring the values to the checkboxes when you do an edit?
let's say I have 3 checkboxes:
test1 checked
test not_checked
test3 checked
the value are saved in the database. Next time I want to edit the records the "test1" and "text3" should be already checked when openening the form. I tried to modifiy your script but couldn't find out how to bring the values from the json dataset to your function...
Most Users Ever Online: 715
Currently Online:
41 Guest(s)
Currently Browsing this Page:
1 Guest(s)
Top Posters:
OlegK: 1255
markw65: 179
kobruleht: 144
phicarre: 132
YamilBracho: 124
Renso: 118
Member Stats:
Guest Posters: 447
Members: 11373
Moderators: 2
Admins: 1
Forum Stats:
Groups: 1
Forums: 8
Topics: 10592
Posts: 31289
Newest Members:
, razia, Prankie, psky, praveen neelam, greg.valainis@pa-tech.comModerators: tony: 7721, Rumen[Trirand]: 81
Administrators: admin: 66