Question

我正在尝试使用Ajax复选框。没有Ajax，我已经处理好了。这是我的Jquery代码

$("#skillcat").click(function(e) {
    var submit_val = new Array();
    e.preventDefault();
     var ids = $('check_subjects input:checked')
           .map(function(){
             return this.value;
           }).get();

    $.ajax( {
    type : "POST",
    dataType : "json",
    url : "./wp-admin/admin-ajax.php",
    data : {
        action : 'each_category',
        check_subjects : ids
    },
    success : function(data) {
        alert(data);

        $('#accordion').html(data);


    }
    });
});

这是我的php代码，其中在服务器端生成按钮和复选框

foreach($subjects as $key=> $data){     
echo '<input type="checkbox" id="'. $data->id .'" value="'. $data->id .'" name="check_subjects[]">&nbsp;&nbsp;  '. $data->subject .'<br>';
}

Serverside我曾经从Post数组中捕获数据

if(isset($_POST['check_subjects'])){
    //var_dump(check_subjects);
    $check_subjects  = implode(',', $_POST['check_subjects']);
    //echo '$check_subjects&nbsp;&nbsp;&nbsp;&nbsp;'. $check_subjects;
}

然而，当我运行上面的代码时，我注意到一些数据被发送到服务器（通过chrom developer工具）。但我在警报框中得到null。我想响应是空的，因为数据没有正确发送到服务器。我不确定用于将请求传递给Ajax的javasript代码。

有人可以解释我在哪里犯了错误吗？

Answer 1

期待JSON，你正在返回html。所以让dataType HTML或json编码你的返回...

Answer 2

试试这个：

$("#skillcat").on('click', function (e) {
    e.preventDefault();

    var ids = [];
    var $el = $('[name*=check_subjects]:checked'); //Get all checked Checkboxes
    $el.each(function () {
        ids.push($(this).attr('id')); //get the Id from each checkbox
    });

    $.ajax({
        type: "POST",
        dataType: "html",
        url : "./wp-admin/admin-ajax.php",
        data: {
            action: 'each_category',
            check_subjects: ids
        },
        success: function (data) {
            alert(data);
            $('#accordion').html(data);
        }
    });
});

如何使用Jquery ajax复选框

2 个答案: