基于用户ID的复选框,它保存了所有复选框中的唯一一个ID

时间:2018-09-07 21:00:50

标签: javascript php jquery html checkbox

我有一个基于用户ID的带有10个复选框的表单,但是当我在数据库中选中一个框时,我看到只有用户ID 1复选框正在保存。请查看下面的代码,感谢您的帮助!

HTML:

<form method="post" action="" id="prezente" uid="<?php echo $row['id'];?>">

     <input type="checkbox" name="day1" id="day1" value="1" class="form-check-input">

     <input type="checkbox" name="day2" id="day2" value="1" class="form-check-input">

     <input type="checkbox" name="day3" id="day3" value="1" class="form-check-input">

And so on until day10 ..
</form>

Javascript:

$(document).ready(function(){

$('#day1,#day2,#day3').click(function(){

   var id = $('#prezente').attr('uid');
   var day1 = $('input[name=day1]:checked').val();
   var day2 = $('input[name=day2]:checked').val();
   var day3 = $('input[name=day3]:checked').val();

            $.ajax({
                url: 'sql/add-days.php?uid='+id,
                type: 'post',
                data: { day1: day1,day2: day2,day3: day3 },
                success:function(data){
                  alert("success");
                }
            });
        });
});

add-days.php文件:

// Make a MySQL Connection
$db = mysqli_connect("localhost", "stelelea_anapp", "fidodido", "stelelea_anadanceapp");

$day1 = $_POST['day1'];
$day2 = $_POST['day2'];
$day3 = $_POST['day3'];

$uid = $_GET['uid'];

 $query = mysqli_query($db,"UPDATE `inscrieri` SET day1='$day1',day2='$day2',day3='$day3' WHERE id = $uid");

这是我的复选框的样子,一个圆环代表一天:

enter image description here

1 个答案:

答案 0 :(得分:0)

修改了html和javascript以使用带有上下文查找的类。

$(document).ready(function() {
  //bind on the shared class so you don't have to look for multiple ids or classes
  $('.day').click(function() {
    //get the form that is the parent of the day clicked
    var $form = $(this).closest('.prezente');
    //get the id of the form
    var id = $form.attr('uid');
    //get the days that belong to the form
    //if the field is not checked, it would not be found and would return
    //  undefined for the val(), in which case we can default to 0
    var day1 = $form.find('.day1:checked').val() || 0;
    var day2 = $form.find('.day2:checked').val() || 0;
    var day3 = $form.find('.day3:checked').val() || 0;

    $.ajax({
      url: 'sql/add-days.php?uid=' + id,
      type: 'post',
      data: {
        day1: day1,
        day2: day2,
        day3: day3
      },
      success: function(data) {
        alert("success");
      }
    });
  });
});
<form method="post" action="" class="prezente" uid="<?php echo $row['id'];?>">
  <input type="checkbox" name="day1" value="1" class="day day1 form-check-input">
  <input type="checkbox" name="day2" value="1" class="day day2 form-check-input">
  <input type="checkbox" name="day3" value="1" class="day day3 form-check-input">
</form>