Multiple groups (variable number) name the generation of different radio button groups

When I recently made a project with a DataTable in jquery, I encountered a problem that required generating groups of radio buttons, and the name of each radio button group was different, and of course I thought of using loops to generate the radio button groups. There is no problem with generating the radio button group itself, but when the list interface is refreshed again, the index of the generated radio button group name will change. To have the loop variable begin looping from 0, you need to use the two properties of the DataTable: Predrawcallback (called before the Flush) and drawcallback (called after the refresh). The sample code is as follows:

$ (function () {

var taskId = $ (' #taskId '). Val ();

var Taskkey = $ (' #taskKey '). Val ();

var savedoptionarray = new Array ();

var savedcommentarray=new Array ();

var xmhzlistidx =-1;

DataTable

otable = $ (' #dataTable '). DataTable ({

"Aasorting": [

[1, "DESC"]

],//Sort Settings

"predrawcallback": function (Settings) {

Savedoptionarray = new Array ();

for (var k= 0; k <= xmhzlistidx; k++) {

var ProjectID = $ ("#hid_projectId_" + K). Val ();

if (projectid) {

var optionval = 0;

var comment= $ ("#hid_comment_" + ProjectID). Val ();

if (document.getElementById ("Option_" +projectid+ "_agree"). Checked) {

optionval = 1;

savedcommentarray["ID" + projectid] = comment;

} else if (document.getElementById ("Option_" +projectid+ "_neededit"). Checked) {

optionval = 2;

savedcommentarray["ID" + projectid] = comment;

} else if (document.getElementById ("Option_" +projectid+ "_delete"). Checked) {

optionval = 3;

savedcommentarray["ID" + projectid] = comment;

}

savedoptionarray["ID" + projectid] = Optionval;

}

}

xmhzlistidx =-1;

},

"drawcallback": function (Settings) {

for (var key in Savedoptionarray) {

var projectidloop = key.substr (2);

var checkv = Savedoptionarray[key];

if (checkv = = 1) {

$ ("#option_" +projectidloop+ "_agree"). attr ("Checked", "checked");

$ ("#auditOpinion"). Val (Savedcommentarray[key]);

$ ("#hid_comment_" + Projectidloop). Val (Savedcommentarray[key]);

} else if (checkv = = 2) {

$ ("#option_" +projectidloop+ "_neededit"). attr ("Checked", "checked");

$ ("#auditOpinion"). Val (Savedcommentarray[key]);

$ ("#hid_comment_" + Projectidloop). Val (Savedcommentarray[key]);

$ ("#hid_commentId_" + projectidloop). CSS (' Display ', ' block ');

} else if (checkv = = 3) {

$ ("#option_" +projectidloop+ "_delete"). attr ("Checked", "checked");

$ ("#auditOpinion"). Val (Savedcommentarray[key]);

$ ("#hid_comment_" + Projectidloop). Val (Savedcommentarray[key]);

$ ("#hid_commentId_" + projectidloop). CSS (' Display ', ' block ');

}

}

},

"Ajax": {

"url": __context__ + "/institute/xmylxhuizhong!list",

"Type": "POST",

"Data": {

' TaskId ': taskId,

' Taskkey ': Taskkey,

},

Background Pass parameters

"Data": function (d) {

var searchcondition = $ ("#projectgress"). Serializearray ();

var searchresult = initialsearchcondition (searchcondition, D);

return searchresult;

//},

},

"Aocolumns": [

{

"Mdata": "ProjectName",

},

{

"Mdata": "Applypersonname",

},

{

"Mdata": "Deptcodename",

},

{

"Mdata": "Specializedfieldname",

},

{

"Mdata": "Projectpreliminary.summary",

},

{

"Mdata": "Projectpreliminary.innovation",

},

{

"Mdata": "Projectpreliminary.goal",

},

{

"Mdata": "Projectpreliminary.cost",

},

{

"Mdata": "ProjectID",

"Sortable": false,//control single-column sorting

"Mrender": Function (data, type, full) {

Return ' <a href= ' javascript:void (0) "+ data + ');" > Edit </a> ';

}

},

{

"Mdata": "ProjectID",

"Sortable": false,//control single-column sorting

"Mrender": Function (data, type, full) {

Xmhzlistidx + +;

return ' <input type= ' Radio "id=" Option_ ' +data+ ' _agree "value=" Agree "name=" option[' +xmhzlistidx+ '] "> Agree &nbsp; ' +

' <input type= ' Radio "id=" Option_ ' +data+ ' _neededit "value=" Neededit "name=" option[' +xmhzlistidx+ '] "> Need to Modify & nbsp; ' +

' <input type= ' radio ' id= ' option_ ' +data+ ' _delete ' value= ' delete ' name= ' option[' +xmhzlistidx+ '] ' > delete ' +

' <input type= ' hidden "id=" hid_projectid_ ' +xmhzlistidx+ ' "name=" projectid[' +xmhzlistidx+ '] "value=" ' +data+ ' "> ' +

' <input type= ' hidden "id=" Hid_comment_ ' +data+ ' "name=" comment[' +xmhzlistidx+ '] ">" +

' <a href= ' javascript:void (0) "id=" Hid_commentid_ ' +data+ ' "style=" display:none; "name=" commentid[' +xmhzListIdx+ ' ] "onclick=" addandeditcomment (' +xmhzlistidx+ '); > Comments </a> ';

}

},

],

"Bfilter": false,

"Binfo": true,

"Bpaginate": true,

"Bprocessing": true,

"Bsort": true,//Sort

"Fnrowcallback": Function (Nrow, AData, Idisplayindex) {

/* Append the grade to the default row class name */

Processing events after rendering a table

if (adata[2] = = "1") {

$ (' Td:eq (2) ', nrow). html (' <b>A</b> ');

}

return nrow;

},

"Bserverside": true,

"Olanguage": {

"Slengthmenu": "Show _menu_ per page",

"Szerorecords": "No qualifying data found",

"Sprocessing": "

"Sinfo": "Current section _start_-_end_ total _total_",

"Sinfoempty": "No Record",

"Sinfofiltered": "(Filtered from _max_ Records)",

"Ssearch": "Search",

"Sprocessing": "Loading ...",

"Opaginate": {

"Sfirst": "Home",

"Sprevious": "Previous Page",

"Snext": "Next Page",

"Slast": "Last"

}

},

"Blengthchange": false,//user cannot change the number of displays per page

"Idisplaylength": 10,//per page 10 data

"Spaginationtype": "Full_numbers",//pagination footer is paginated numerically

});

Return

});

This article is from the "MOMO" blog, make sure to keep this source http://4446664.blog.51cto.com/4436664/1603657

Multiple groups (variable number) name the generation of different radio button groups