Ajax, jQuery - 选中或取消选中复选框时更新数据库答案

【问题标题】：Ajax, jQuery- Update Database when Checkboxes is/are checked or uncheckedAjax, jQuery - 选中或取消选中复选框时更新数据库
【发布时间】：2013-04-04 16:06:51
【问题描述】：

我有一个系统可以让管理员为特定折扣类型设置折扣启用或禁用，折扣值已在数据库中设置：

<li>Discount For Items</li>
<li><input type="checkbox" class="discount" value="1"></li>

<li>Discount For General Ordesr</li>
<li><input type="checkbox" class="discount" value="2"></li>

<li>Discount For Preferred Customer</li>
<li><input type="checkbox" class="discount" value="2"></li>

我想使用 jQuery/Ajax 更新行 enable（布尔值），如果是 checked，则选择 discount type，如果 unchecked 禁用 discount type。
我真的需要你的帮助，希望我的解释是可以理解的。

【问题讨论】：

首先你不能对多个元素使用相同的id！
这就是为什么我也放了一个类:)
不，你不明白，每个项目一个 id。 ID 不能在同一页面中重复使用。
您需要什么帮助？我们不会为您创建 PHP 文件！
我只需要处理复选框的 jQuery/Ajax 提示！来吧:)

标签： php jquery mysql ajax checkbox

【解决方案1】：

你可以试试这样的：

$(document).ready(function(){
  $('input.discount').change(function(){

    $this = $(this);

    $.post(
      "my-php-file.php",
      {
        value: $this.val(),
        checked: $this.is(':checked')
      },
      function(data){
        // do something with returned data
      },
      'json'
    );
  });
});

【讨论】：

【解决方案2】：

使用 jQuery，你可以做这样的事情，但是你需要你的服务器端逻辑（服务）来做实际的数据库操作（我们将 discount-type 作为 type 以及 AJAX POST 请求）。

    <li>Discount For Items</li>
    <li><input type="checkbox" class="discount" data-discount-type="all" /></li>

    <li>Discount For General Ordesr</li>
    <li><input type="checkbox" class="discount" data-discount-type="general" /></li>

    <li>Discount For Preferred Customer</li>
    <li><input type="checkbox" class="discount" data-discount-type="customer" /></li>

    // JavaScript
    $(function(){
       var url = 'my-php-file.php';

       $('input:checkbox').on('click', function(){
           var $this = $(this);
       if($this.prop('checked'))
          $.post(url,{type : $this.data('discount-type') }).done(function(response){
             // success custom logic
          });
      });
    });

【讨论】：