Question

我想在没有提交按钮的情况下发送POST数据，当勾选其中一个复选框时 - 使用AJAX。

我有这个代码，但我认为，当我勾选复选框时，我应该收到发布数据的警报（知道它的工作原理），但我根本没有任何反应。我添加了jquery，所以它在代码函数中出现了某种错误。

<form method="post" name="form1">
    <input type="checkbox" name="checkboxList[]" value="1">value1</input>
    <input type="checkbox" name="checkboxList[]" value="2">value2</input>
    <input type="checkbox" name="checkboxList[]" value="3">value3</input>
</form>

<script>

jQuery(document).ready(function($){

    // jQuery code is in here
    $("input[type=checkbox]").on("click", function() {

    var data = $(this).val();
    console.log(data); // 1, 2 or 3 (value)
    $.ajax({
        url: "<?php echo JURI::getInstance(); ?>", // URL should be correct!
        type: "POST", 
        async: true,
        cache: false,
        data: {data: data},
        dataType: 'text', 
        success: function(data){ 
            alert(data); 
        }
    });
    });

});




</script>

问题：获取页面的HTML内容，而不是成功方法的值

Answer 1

更改您的Html，如下所示1.删除</input>并更改2.将表单name更改为id

<form method="post" id="form1">
    <input type="checkbox" name="checkboxList[]" value="1">value1
    <input type="checkbox" name="checkboxList[]" value="2">value2
    <input type="checkbox" name="checkboxList[]" value="3">value3
</form>

JS的变化

var data = $("#form1").serialize();

您的表单未选择，并且在帖子中有空白数据

Answer 2

尝试以下代码。

<form method="post" name="form1">
    <input type="checkbox" name="checkboxList[]" value="1">value1</input>
    <input type="checkbox" name="checkboxList[]" value="2">value2</input>
    <input type="checkbox" name="checkboxList[]" value="3">value3</input>
</form>

<script>
    $("input[type=checkbox]").on("click", function() {
      var data = $("form").serialize();
        $.ajax({
            url: "../../x.php", // URL should be correct!
            type: "POST",
            async: true,
            cache: false,
            data: {data: data},
            dataType: 'json', 
            success: function(response_data){ 
                alert(response_data);
            }
        });
    });
 </script>

复选框是故障单时发送POST - 没有提交按钮

2 个答案: