I am trying to have to check boxes through ajax, but it is not working properly. I am not able to change state of the first checkbox, only the second one is working fine. Could anyone spot the error here?
$.ajax({
type:"POST",
url:"../scripts/domainlist.php?dept="+deptid+"&pro="+proid,
contentType:"application/json; charset:utf-8",
dataType:"json",
success: function(data){
$('#domainlist').empty();
$('#domainlist')
.append("<tr rowspan='2' class='domainname'>
<th class='domainname'>Domain Name</th>
<th class='domainname'>Is this domain applicable to your organization?</th>
<th style='height:30px' class='domainname'>Do you want this domain to be displayed?</th>
</tr>");
var index = 0;
$.each(data,function(i,item){
var index2=index+1;
var display_status = "";
var applicable_status = "";
if(data[i].applicable == 1){
applicable_status = "checked";
}
if(data[i].display == 1){
display_status = "checked";
}
$('#domainlist')
.append("<tr class='domainname'>
<td class='domainname'>
<a href='setcategoryapplicability.php?dom="+ data[i].domid +"'>"+ data[i].domname +"</a>
</td>
<td>
<input id='toggle-"+index+"' name='applicable["+data[i].domid+"]' class='toggle toggle-round' type=checkbox "+applicable_status+">
<label for='toggle-"+index+"]'></label>
</td>
<td>
<input id='toggle-"+index2+"' name='display["+data[i].domid+"]' class='toggle toggle-round' type=checkbox "+display_status+">
<label for='toggle-"+index2+"'></label>
</td>
</tr>");
index = index +2;
});
},
complete: function(){
}
});
I am so sorry to trouble you guys. I feel so stupid. Thank you for your responses. It is working fine now.