使用基于数组值的jquery设置复选框

时间:2016-04-08 21:02:17

标签: php jquery mysql checkbox

我正在使用Bootstrap中的表,其中一列用于复选框。该表填充了mysql db的值。在db中,复选框的列的值为1或0.如果值为1,我希望选中复选框。我有这个代码,但它只适用于第一个复选框。我怎样才能将它用于所有复选框?这是我的代码。

                <tbody>
<?php while($row = $sql->fetch()) { ?>
  <tr>
    <td><?php echo $row['Opleiding_ID']; ?></td>
    <td><?php echo $row['Opleiding']; ?></td>
    <?php $checked = $row['Hidden']; ?>

    <script type="text/JavaScript">
$(document).ready(function(){


                  var arr<?php echo $row["Opleiding_ID"]; ?> = <?php echo json_encode($checked); ?>;

              if (arr<?php echo $row["Opleiding_ID"]; ?> == "1") {

    $("#mycheckbox<?php echo $row["Opleiding_ID"]; ?>").prop('checked', true);
                  } else {
                    $("#mycheckbox<?php echo $row["Opleiding_ID"]; ?>").prop('checked', false);  
                  }
                  });



</script>        
    <td><input type="checkbox" id="mycheckbox<?php echo $row["Opleiding_ID"]; ?>" name="checks" value="" class="check"></td>
  </tr>
  <?php } ?>
</tbody>

3 个答案:

答案 0 :(得分:1)

$(document).ready(function() {
        var arr = <?php echo json_encode($checked); ?>;
        $.each(arr, function(index) {
            if (arr[index] == "1") {
                $("#mycheckbox").prop('checked', true);
            }
        });
    });

未经测试&amp;可能是马车。但这是你应该采取的正确方法。在循环中运行元素。

答案 1 :(得分:0)

如果您动态生成表格,可以在此处设置复选框值。
JS:

 $(document).ready(function(){
// your arr from php
  var arr = [{'value' : 0 , 'name' :'Itme1' , 'description':'description1'},
            {'value' : 1 , 'name' :'Itme2' , 'description':'description2'},
            {'value' : 0 , 'name' :'Itme3' , 'description':'description3'},
            {'value' : 1 , 'name' :'Itme4' , 'description':'description4'}];

    var tableContent = '';
       $.map(arr, function (item) {
         checked=  (item.value) ? "checked" : "" ;
         tableContent+='<tr><td><input type="checkbox"'+checked+ '></td><td>' + item.name + '</td><td>' + item.description + '</td><td><input type="button" value="Edit" ></td></tr>';  
      });
    $("#myTbody").html(tableContent);
});

示例:http://jsfiddle.net/tg5op333/39/

答案 2 :(得分:0)

如果您有自动增量ID,则可以在javascript代码中回显它,如此

<script type="text/JavaScript">
    $(document).ready(function(){

                  var arr<?php echo $row["id"]; ?> = <?php echo json_encode($checked); ?>;
                      $.each(arr<?php echo $row["id"]; ?>, function(index) {
                  if (arr<?php echo $row["id"]; ?>[index] == "1") {

    $(".check<?php echo $row["id"]; ?>").prop('checked', true);
                  }
                             });
            });
</script>


    <td><input type="checkbox" id="mycheckbox" name="checks" value="" class="check<?php echo $row["id"]; ?>"></td>
  </tr>
  <?php } ?>
</tbody>

如果您要遵循该代码,您应该创建一个像这样的变量$ id = $ row [“id”];输入更少