如何使用 Ajax、PHP 和 JQuery 检查多个输入复选框？

Posted 2023-05-09

【中文标题】如何使用 Ajax、PHP 和 JQuery 检查多个输入复选框？

【英文标题】：How to check multiple input checkboxes with Ajax, PHP and JQuery?

【发布时间】：2016-01-26 07:05:27

【问题描述】：

我正在为我的数据库中的产品进行简单的类别管理，我很难找到一个好的算法来检查我的数据库表中属于特定类别的项目的复选框。

基本上我使用的是对以下 php 文件的 JQuery Ajax 调用：

<?php 
    include_once('config.php');
    $id = $_POST['fetchID'];

    //Create PDO Object
    $con = new PDO( DB_DSN, DB_USERNAME, DB_PASSWORD );
    //Set Error Handling for PDO
    $con->setAttribute( PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION );
    //Query

    $sql = "SELECT prod_cat.cat_id FROM prod_cat LEFT JOIN products ON products.id = prod_cat.product_id LEFT JOIN category on category.cat_id = prod_cat.cat_id WHERE id = $id";
    //Prepare Statement
    $stmt = $con->prepare($sql);
    $stmt->execute();

    echo "<button id='backBtn-$id' class='backBtn'></button>
    <!-- Left Column -->
    <section class='adminLCol'>
        <h4>Menu</h4>                   
        <form class='updateProductCategory' id='updateProductCat-$id' method='post' action=''>
          <input class='input_class_checkbox' type='checkbox' id='basicCollection_$id' name='cat[]' value='Basic Collection' checked>Basic Collection<br />
          <input class='input_class_checkbox' type='checkbox' id='teesAndTanks_$id' name='cat[]' value='Tees and Tanks' checked>Tees and Tanks<br />
          <input class='input_class_checkbox' type='checkbox' id='shirts_$id' name='cat[]' value='Shirts'>Shirts<br />
          <input class='input_class_checkbox' type='checkbox' id='topsAndBlouses_$id' name='cat[]' value='Tops and Blouses'>Tops and Blouses<br />
        </form>
    </section>  

    <!-- Right Column -->
    <div class='adminRCol'>
        <section class='adminRContent'>
            <h4>Visibility</h4>                 
            <form>
              <input class='radio_selection' type='radio' name='visibility' value='Enable' checked>Enable<br />
              <input class='radio_selection' type='radio' name='visibility' value='Disable'>Disable
            </form>
        </section>
    </div>";
?>

分类表如下所示：

+-------------+-------------------+
|   cat_id    | name              |
+-------------+-------------------+
|           1 | Basic Collection  |
|           2 | Tees and Tanks    |
|           3 | Shirts            |
|           4 | Tops and Blouses  |
+-------------+-------------------+

这是我的产品表的样子：

+----+-----------------+------------------+
| id | name            | description      |
+----+-----------------+------------------+
|  2 | Product One     | Made in Portugal |
|  3 | Product Two     | Made in Brazil   |
+----+-----------------+------------------+

这就是我的 prod_cat 表的样子：

+------------+-------------+
| prod_id    | cat_id      |
+------------+-------------+
|          2 |           1 |
|          3 |           1 |
|          2 |           2 |
|          2 |           4 |
+------------+-------------+

上面的 PHP 文件连接到我的数据库并获取产品所属的类别。这就是$sql 输出对于products.id = 2 的样子：

+-------------+
|    cat_id   |
+-------------+
|           1 |
|           2 |
|           4 |
+-------------+

现在，如您所见，这些是应在我的表单中检查的 3 个类别，其中包含所有复选框。这就是我卡住的地方。鉴于仅要检查这 3 个类别，检查这些复选框的好方法是什么？

如果您需要有关该问题的更多详细信息，请发表评论。

谢谢

编辑： 我在 $stmt->fetchAll() 的那个 select 语句上做了一个 print_r，下面是我得到的结果数组。我不知道该怎么办。我把它贴在这里，如果它有任何用处：

Array ( [
    0] => Array ( 
            [cat_id] => 1 [0] => 1 
        ) 
    [1] => Array ( 
            [cat_id] => 2 [0] => 2 
        ) 
    [2] => Array ( 
            [cat_id] => 4 [0] => 4 
        ) 
) 

【问题讨论】：

您可以发布您的 ajax 代码吗？您是否从 ajax 请求中获取 json 作为响应？还可以在 ajax 成功中发布 console.log，而不是从 php 页面中的 print_r。因为这是你需要处理的事情

I can see you are sending html response.You can load the full form at first time and when a product is selected get only the list of check boxes to check as the result using ajax.It will reduce响应的大小。

【参考方案1】：

如果我正确理解了这个问题，那么您使用的外连接不恰当。

我会使用：

$sql = "SELECT name FROM category "
. "JOIN prod_cat ON prod_cat.cat_id = category.cat_id "
. "WHERE prod_cat.prod_id = ?";

得到结果：

$stmt = $con->prepare($sql);
$stmt->execute(array($id));
$result = $stmt->fetchAll();

把二维数组变成一维数组：

$array = array_map('current', $result);

如果产品属于特定类别，然后检查每个复选框，例如：

if (in_array('Basic Collection', $array)) 
    echo 'checked';

不需要 Ajax 或 jQuery。

顺便说一句，当您要像这样将用户输入放入查询中时，使用准备好的语句几乎没有意义。

【参考方案2】：

$sql = "SELECT name FROM category "
. "JOIN prod_cat ON prod_cat.cat_id = category.cat_id "
. "WHERE prod_cat.prod_id = ?";
$condition=" WHERE ";
foreach($ids as $id)
$condition.="prod_cat.prod_id =".$id['cat_id']." or ";

$condition= substr($condition, 0, -2);

$sql.=$condition;

如果您想为多个类别使用循环添加条件并创建动态查询