通过 jQuery ajax() 向 PHP 发送多个复选框数据 [英] Send multiple checkbox data to PHP via jQuery ajax()

问题描述

我想通过 jQuery 的 .ajax() 在我的网站上提交一个包含 textarea 字段和输入字段(type="checkbox" 带有任意/可变数量的复选框)的 POST 表单.PHP接收textarea数据，ajax响应正确显示给用户.但是，PHP 似乎没有收到复选框数据(是否已选中).我怎样才能让它工作?这是我的代码:

I want to submit a POST form that contains a textarea field and an input field(s) (type="checkbox" with an arbitrary/variable number of checkboxes) on my website via jQuery's .ajax(). PHP receives the textarea data and the ajax response is correctly displayed to the user. However, it seems that PHP is not receiving the checkbox data (was it checked, or not). How can I get this to work? Here is the code I have:

HTML:

<form method="post" action="myurl.php" id=myForm>
    <textarea id="myField" type="text" name="myField"></textarea>
    <input type="checkbox" name="myCheckboxes[]" id="myCheckboxes" value="someValue1" />
    <input type="checkbox" name="myCheckboxes[]" id="myCheckboxes" value="someValue2" />
    ...(maybe some more checkboxes - dynamically generated as necessary)
    <input id="submit" type="submit" name="submit" value="Submit" onclick="submitForm()" />
</form>

jQuery:

function submitForm() {
$(document).ready(function() {
$("form#myForm").submit(function() {

        var myCheckboxes = new Array();
        $("input:checked").each(function() {
           myCheckboxes.push($(this).val());
        });

        $.ajax({
            type: "POST",
            url: "myurl.php",
            dataType: 'html',
            data: { myField:$("textarea[name=myField]").val(),
                    myCheckboxes:myCheckboxes },
            success: function(data){
                $('#myResponse').html(data)
            }
        });
        return false;
});
});

现在，PHP

$myField = htmlspecialchars( $_POST['myField'] ) );
if( isset( $_POST['myCheckboxes'] ) )
{
    for ( $i=0; $i < count( $_POST['myCheckboxes'] ); $i++ )
    {
        // do some stuff, save to database, etc.
    }
}
// create the response
$response = 'an HTML response';
$response = stripslashes($response);
echo($response);

一切正常:提交表单时，新记录存储在我的数据库中，响应被ajaxed回网页，但未发送复选框数据.我想知道哪些复选框已被选中(如果有).我已经阅读了 .serialize()、JSON 等，但这些都没有奏效.我是否必须在 jQuery 和 PHP 中序列化/JSON?如何?使用复选框发送表单数据时，一种方法是否比另一种方法更好?我已经被困在这个问题上 2 天了.任何帮助将不胜感激.提前致谢！

Everything works great: when the form is submitted a new record is stored in my database, the response is ajaxed back to webpage, but the checkbox data is not sent. I want to know which, if any, of the checkboxes have been checked. I've read about .serialize(), JSON, etc, but none this has worked. Do I have to serialize/JSON in jQuery and PHP? How? Is one method better than another when sending form data with checkboxes? I've been stuck on this for 2 days. Any help would be greatly appreciated. Thanks ahead of time!

推荐答案

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

您将复选框推送到错误的数组 data['myCheckboxes[]'] 而不是 myCheckboxes.push

You are pushing checkboxes to wrong array data['myCheckboxes[]'] instead of myCheckboxes.push

这篇关于通过 jQuery ajax() 向 PHP 发送多个复选框数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！