Как передать несколько флажков с помощью jQuery ajax post

Ответ 1

Из документов jquery для POST (третий пример):

$.post("test.php", { 'choices[]': ["Jon", "Susan"] });

Итак, я просто перебираю флажки и строю массив. Что-то вроде

var data = { 'user_ids[]' : []};
$(":checked").each(function() {
  data['user_ids[]'].push($(this).val());
});
$.post("ajax.php", data);

Ответ 2

Просто наткнулся на это, пытаясь найти решение для той же проблемы. Реализация решения Paul Я сделал несколько настроек для правильной работы этой функции.

var data = { 'venue[]' : []};

$("input:checked").each(function() {
   data['venue[]'].push($(this).val());
});

Короче добавление ввода: проверено, а не: проверено, ограничивает поля, вводимые в массив, только флажками в форме. Павел действительно прав с this, который должен быть заключен как $(this)

Ответ 3

Можно использовать следующее, а затем взорвать результат сообщения explode(",", $_POST['data']);, чтобы получить массив результатов.

var data = new Array();
$("input[name='checkBoxesName']:checked").each(function(i) {
    data.push($(this).val());
});

Ответ 4

Здесь более гибкий способ.

скажите, что это ваша форма.

<form>
<input type='checkbox' name='user_ids[]' value='1'id='checkbox_1' />
<input type='checkbox' name='user_ids[]' value='2'id='checkbox_2' />
<input type='checkbox' name='user_ids[]' value='3'id='checkbox_3' />
<input name="confirm" type="button" value="confirm" onclick="submit_form();" />
</form>

И это ваш jquery ajax ниже...

                // Don't get confused at this portion right here
                // cuz "var data" will get all the values that the form
                // has submitted in the $_POST. It doesn't matter if you 
                // try to pass a text or password or select form element.
                // Remember that the "form" is not a name attribute
                // of the form, but the "form element" itself that submitted
                // the current post method
                var data = $("form").serialize(); 

                $.ajax({
                    url: "link/of/your/ajax.php", // link of your "whatever" php
                    type: "POST",
                    async: true,
                    cache: false,
                    data: data, // all data will be passed here
                    success: function(data){ 
                        alert(data) // The data that is echoed from the ajax.php
                    }
                });

И в вашем ajax.php вы попробуете эхом или print_r свой пост, чтобы увидеть, что происходит внутри него. Это должно выглядеть так. Будут возвращены только отмеченные флажки. Если вы его не проверили, он вернет ошибку.

<?php 
    print_r($_POST); // this will be echoed back to you upon success.
    echo "This one too, will be echoed back to you";

Надеюсь, что это достаточно ясно.

Ответ 5

Если вы не настроите свое собственное решение, ознакомьтесь с этим плагином jQuery:

malsup.com/jquery/form/

Он сделает это и многое другое для вас. Это настоятельно рекомендуется.

Ответ 6

Следующее от Пола Тарьяна работало для меня,

var data = { 'user_ids[]' : []};
$(":checked").each(function() {
  data['user_ids[]'].push($(this).val());
});
$.post("ajax.php", data);

но у меня было несколько форм на моей странице, и он вытащил флажки из всех форм, поэтому я сделал следующую модификацию, поэтому он только вытащил из одной формы,

var data = { 'user_ids[]' : []};
$('#name_of_your_form input[name="user_ids[]"]:checked').each(function() {
  data['user_ids[]'].push($(this).val());
});
$.post("ajax.php", data);

Просто измените name_of_your_form на имя вашей формы.

Я также упомянул, что если пользователь не проверяет какие-либо поля, то в PHP нет массива isset. Мне нужно было знать, не отключил ли пользователь все поля, поэтому я добавил в форму следующее:

<input style="display:none;" type="checkbox" name="user_ids[]" value="none" checked="checked"></input>

Таким образом, если флажки не отмечены, он все равно установит массив со значением "none".

Ответ 7

Это было бы лучше и проще

var arr = $('input[name="user_ids[]"]').map(function(){
  return $(this).val();
}).get();

console.log(arr);