与复选框相关的ajax问题

时间:2015-11-17 12:14:59

标签: checkbox

这是我的ajax代码

 $(document).ready(function (e) {
            $('.checkbox').click(function (e) {

                $(event.currentTarget).val($(event.currentTarget)[0].checked);
                var Curl = $('#chkform').attr("action");
                var val = $('.checkbox:checked').val();
                alert(val);
                $.ajax({
                    url: Curl,
                    type: "POST",
                    dataType: "json",
                    data: {
                        chk: val
                    },
                    contentType: false,
                    cache: false,
                    processData: false,
                    success: function (result) {
                        alert(result);
                        var l = result.length;
                        for (var i = 0; i < l; i++) {
                            $('#table').append($('<tbody>')
                                    .append($('<tr>')
                                            .append('<td>' + result[i].id + '</td>')
                                            .append('<td>' + result[i].product_name + '</td>')
                                            .append('<td>' + result[i].product_description + '</td>')
                                            .append('<td>' + result[i].product_price + '</td>')
                                            .append('<td>' + result[i].product_pieces + '</td>'))
                                    );

                        }

                    },
                    error: function () {
                    }
                });
            });
        });
 <form method="post" id="chkform" action="<?php echo site_url('form_sort/sorting') ?>" >
        <input type="checkbox" name="chk" value="5000-6999" class="checkbox">5000-6999<br>
        <input type="checkbox" name="chk" value="7000-8999" class="checkbox">7000-8999<br>
        <input type="checkbox" name="chk" value="9000-12999"class="checkbox">9000-12999<br>


    </form>

这是我的控制器代码

    $chkvalue = $this->input->post("chk");
    echo $chkvalue;

我无法获得$ chkvalue中的复选框值,当我点击复选框提醒时,我将null设为null我希望结果是复选框值,因为我回显$ chkvalue。

2 个答案:

答案 0 :(得分:0)

我认为麻烦的是你在点击功能中使用e作为参数然后你使用event.currentTarget。

您可以使用以下内容:

$(document).ready(function (e) {
    $('.checkbox').click(function (event) {
        $(event.currentTarget).val($(event.currentTarget)[0].checked);
        //Rest of code here
    });
});

我不确定无论何时将e更改为事件都会有效,我不明白为什么要更改目标值。

也许这样的事情会更好:

$(document).ready(function (e) {
    $('.checkbox').each(function(){
        $(this).on('click', function(){
          var Curl = $('#chkform').attr("action");
          var val;
          if($(this).is(":checked")){
           val = "checked"
          }else{
           val = "unchecked"
          }
        //Condition could be simplify to ($(this).is(":checked"))?val = "checked" : val = "unchecked"; where ? is the value if it's true and : the value if it's false
        alert("val="+val);
       //Ajax to send here
       });
    });
});

答案 1 :(得分:0)

 $(document).ready(function (e) {
            $('.checkbox').click(function (e) {




                $.ajax({
                    url: Curl,
                    type: "POST",

                    data: {
                        chk: val
                    },

                    cache: false,

                    success: function (result) {

                        var l = result.length;
                        for (var i = 0; i < l; i++) {
                            $('#table').append($('<tbody>')
                                    .append($('<tr>')
                                            .append('<td>' + result[i].id + '</td>')
                                            .append('<td>' + result[i].product_name + '</td>')
                                            .append('<td>' + result[i].product_description + '</td>')
                                            .append('<td>' + result[i].product_price + '</td>')
                                            .append('<td>' + result[i].product_pieces + '</td>'))
                                    );

                        }

                    },
                    error: function () {
                    }
                });
            });
        });

我编辑代码。这是成功的工作,因为我评论processdata:false,所以我得到复选框值作为控制器中的帖子。