从MYSQL中选择All Checkbox

时间:2013-06-13 16:10:49

标签: php jquery checkbox

今天我正在使用“Checkbox”,只是一个小问题。我的第一页有一个下拉列表,我选择“DropDown 1”项,然后点击“提交”按钮,之后它将转到下一页。那么,第二页将仅使用复选框加载“DropDown 1”下的所有项目。

我的问题是:

如何使用“全部检查”复选框检查所有内容,其中“DropwDown 1”中的项目来自我的数据库[MySQL]。

这是我在第二页的代码:

    <input type="checkbox" name="all" id="all" /> <label for='all'>All</label>
<?php
$dropdown_value = (string)$_POST["id"];
echo "<br/>";
if ($dropdown_value == 'All Building') 
{

     $all = mysql_query("SELECT fldBldgName FROM tblbuildings");
        while ($row = mysql_fetch_array($all))
           {
                echo "<tr><td>";

                echo "<input type='checkbox' name='play[]' class='chk_boxes1' value='" . $row['fldBldgName'] . "'>";
                echo $row['fldBldgName'];

                echo "</td></tr><br/>";
           }
}

    ?>
    <script>
  $(document).ready(function(){
$('input[name="all"]').bind('click', function(){
var status = $(this).is(':checked');
$('input[type="checkbox"]').attr('checked', status);
});
});
    </script>

2 个答案:

答案 0 :(得分:0)

尝试在change元素上收听.chk_boxes事件。在使用“已检查”等“二进制”属性时,您还应该使用prop而不是attr

$('.chk_boxes').on('change', function(){
    $('.chk_boxes1').prop('checked', $(this).prop('checked'));
});

http://api.jquery.com/prop/

您还需要将所有tr / td元素包装在table元素中。:

<table>
<?php
...
?>
</table>

br之后不需要tr个元素。 tr将始终以新的一行开始。

答案 1 :(得分:0)

checked Attribute

echo "<input type='checkbox' class='chk_boxes1' name='play[]' value='".$row['fldBldgName']. "' checked>";

为什么表中有<br>

修改

试试这个:

    echo '<div><input type="checkbox" class="checkall"> Check all</div>';
 $all = mysql_query("SELECT fldBldgName FROM tblbuildings");
        while ($row = mysql_fetch_array($all))
           {

           echo "<div><input type='checkbox' name='play[]' class='chk_boxes1' value='" . $row['fldBldgName']."'>";
           echo $row['fldBldgName'];."</div>";

           }

和jQuery函数:

$(function () {
    $('.checkall').on('click', function () {
        $(this).closest('fieldset').find(':checkbox').prop('checked', this.checked);
    });
});

http://jsfiddle.net/H37cb/210/