通过ajax发送未选中的复选框值

Posted 2023-02-24

【中文标题】通过ajax发送未选中的复选框值

【英文标题】：Send unchecked checkbox value through ajax

【发布时间】：2016-07-16 16:18:46

【问题描述】：

由于我为在 mysql 中保存表单数据而编写的通用函数，我遇到了一个复杂的问题。 所有的表单都经过序列化后通过ajax发送：

$('.suggestSave, .buttonSave').on('submit', function(e) 
        e.preventDefault();
        var data = $(this).serialize();
        ...

然后我通过遍历值并创建保存在数据库中的数据来获取所有 POST 值：

        $data = array();
        foreach ($_POST as $param_name => $param_val) 
          if($param_name != 'action' && $param_name != 'patient' && $param_name != 'jsaction') 
            $name = sanitize($param_name);
            $value = sanitize($param_val);
            $data[$name] = $value;
         
     

自然不会发送未选中的复选框。问题是如果它是空的，我想为这个复选框存储 Int 值 0 而不是 1。 在 html 方面，我有一个经典的语法

   <input type="checkbox" value="1" name="c_name1" checked/>
   <input type="checkbox" value="1" name="c_name2"/>

关于如何处理该问题的任何建议？在一个复选框的情况下，我会检查帖子值是否为 isset()，但由于我通过循环获取名称和值......我没有想法......

【参考方案1】：

使用 values 变量通过 Ajax 发送数据

/* Get input values from form */
values = jQuery("#myform").serializeArray();

/* Because serializeArray() ignores unset checkboxes and radio buttons: */
values = values.concat(
        jQuery('#myform input[type=checkbox]:not(:checked)').map(
                function() 
                    return "name": this.name, "value": this.value
                ).get()
);

【讨论】：

为什么不在 ajax 请求中直接传递 jQuery('#formID').serialize(); 呢？这将涵盖我相信的所有领域？

@techie_28 jQuery 序列化非常模仿标准表单在被附加到请求中的查询字符串或 POST 正文之前如何被浏览器序列化。浏览器不包含未选中的复选框，这很有意义，因为它们具有布尔状态——它们要么被用户选中（包含），要么未被用户选中（不包含）。

我相信 jQuery 序列化包括未选中的复选框，例如 chkBox1=true&chkBox2=&chkBox3=true 假设第一个和第三个被选中，但第二个没有。

尽管如此，这是 Avinash 的一个可爱可爱的解决方案.. :)

【参考方案2】：

在复选框前面加上一个具有相同名称的隐藏字段可以解决问题。如果选中该框，则该值将被复选框的值覆盖，如果没有，则返回第一个值。

   <input type='hidden' value="0" name="c_name1"/>
   <!-- This will be overridden if the following checkbox is checked  -->
   <input type="checkbox" value="1" name="c_name1" checked/>

   <input type='hidden' value="0" name="c_name2"/>
   <input type="checkbox" value="1" name="c_name2"/>

document.form.c_name1 或 $_POST ['c_name1']（如果已提交）将根据复选框是否被选中返回 0 或 1。请注意，名称未声明为数组 - 根据复选框状态返回 1 或 2 个值。

【讨论】：

当您使用 jquery.ajax 序列化表单数据时，这实际上不起作用，因为它发送 c_name1 = 0 和 c_name1 = 1。php 代码处理发布数据的方式会产生错误。在一般情况下，你当然是绝对正确的！

【参考方案3】：

您可以使用数组来定义复选框及其默认值：

$checkboxes = array(
    'c_name1' => 0,
    'c_name2' => 0,
);

$data = array();

foreach ($_POST as $param_name => $param_val) 
    if($param_name != 'action' && $param_name != 'patient' && $param_name != 'jsaction') 
        $name = sanitize($param_name);
        $value = sanitize($param_val);
        $data[$name] = $value;
    


$data = array_replace($checkboxes, $data);

【讨论】：

是的，但必须再次手动完成。无论如何，谢谢，处理客户端问题的解决方案似乎更适合我正在尝试做的事情！

【参考方案4】：

$data['c_name1'] = ( isset($data['c_name1']) )? $data['c_name1']: 0;

【讨论】：

正如我所说，如果该代码必须在几个复选框上工作，我会这样做。在这种情况下，我不知道输入的名称，可能有数百个（并且会有......）。