CODEWITHSUNDEEP
javascriptjqueryajaxjsp
Debrup Majumdar
Debrup Majumdar

Reputation: 114

Form submit after populating checkbox through ajax

I am populating a group of checkboxes by below code

$.ajax({
    url: '/mySite/getOutletsByRegion?regionId='+str,
 success: function(data) {
    $.each(data, function(i, obj) {

        html +='<li><label><input id="outlet1" type="checkbox" value="'+obj.id+'" name="outlet"/>';
        html +=obj.name+"</label></li>";

        });
    $("#outlets").html(html);
 }

But when I am submitting this form , these newly created checkbox values are not available. Am I missing some steps?

Upvotes: 0

Views: 271

Answers (2)

Emil Borconi
Emil Borconi

Reputation: 3467

To complete the previouse answer, you need unique names for form submission, or you can use [] for array, like this:

html +='<li><label><input id="outlet1" type="checkbox" value="'+obj.id+'" name="outlet[]"/>';
html +=obj.name+"</label></li>";

Also I do not know what "#outlets" is make sure you are not injecting the elements AFTER your tag, because it will not get submitted in that case

Upvotes: 0

slash197
slash197

Reputation: 9034

Every ID and name of the new check boxes are the same but should be unique. You could use an array at least for the name attribute

html +='<li><label><input id="outlet' + i + '" type="checkbox" value="'+obj.id+'" name="outlet[' + i + ']"/>';

Upvotes: 1

Related Questions