Reputation: 261
Hi There,
I'm working on a project and try to send the value of my multiple selected "checkboxes". However, the result is always undefined. He can't find the boxes. They stay empty. I've tested another input on the same page, which in case, he found.
The problem here is that my input field stays undefined (For testing purposes I "checked" two Checkboxes)
pager.js
var requestGroupDel = false;
$('.agg_trash').on("click", function() {
if (requestGroupDel == false) {
requestGroupDel = true;
var check_list = $('input[name=check_list]').val();
requestDel = false;
$.ajax({
type: "POST",
url: "app/control/ajax.php?action=groupdelete",
async: true,
data: {
"check_list": check_list
},
success: function(data) {
data = $.trim(data);
requestGroupDel = false;
console.log(data);
}
});
}
});
The Form (It's in a WHILE loop)
<input type="checkbox" class="agg_check" name="check_list[]" value="' . $artikel['id'] . '">
All Checkboxes have the same name, since I want the result as an array, so that I can run a foreach. Why is this input undefined?
Upvotes: 2
Views: 58
Reputation: 4579
You could use the checked
attribute to get the values of those inputs. And then, loop through it with each() function
to build your array.
i.e. :
var check_list = []
$("input[name='check_list[]']:checked").each(function() {
check_list.push($(this).val());
});
console.log(check_list);
Output :
Array [ "2", "3", "4" ]
Upvotes: 2
Reputation: 1774
Change
var check_list = $('input[name=check_list]').val();
By
var check_list = $('input[name^="check_list"]:checked').toArray().map(function(el){
return $(el).val();
});
Upvotes: 0