Synthiatic
Synthiatic

Reputation: 261

jQuery AJAX with array

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

Answers (2)

JazZ
JazZ

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

beta-developper
beta-developper

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

Related Questions