1.链接数据库
<?php
include("DBDA.class.php");
$db=new DBDA();
$sql="select * from fangzi";
$attr=$db->Query($sql); ?>
2.建立复选框表单
<form action="" method="post">
<div>区域:<input type="checkbox" onclick="quanxuan1(this)">全选</div>
<div>
<?php foreach($attr as $v)
{
echo "<input type='checkbox' name='area[]' class='area' value='{$v[2]}'>{$v[2]}";//设置name=area[]是数组,因为有很多个复选框,所以要把它的名字设置为数组,设置class名,为了下面js改变它的属性,给它设置value,为了下面能都取到它的值,进行查询 } ?>
</div><br> <div>租赁类型:<input type="checkbox" onclick="quanxuan2(this)">全选</div>
<div>
<?php
foreach($attr as $v)
{
echo "<input type='checkbox' name='zu[]' class='zu' value='{$v[5]}'>{$v[5]}"; } ?>
</div><br> <div>房屋类型:<input type="checkbox" onclick="quanxuan3(this)">全选</div>
<div>
<?php
foreach($attr as $v)
{
echo "<input type='checkbox' name='fangwu[]' class='fangwu' value='{$v[6]}'>{$v[6]}"; } ?>
</div><br> <div>关键字:<input type="text" name="guanjianzi"></div> <div><input type="submit" value="搜索"></div>
</form>
3.列表的显示
<table width="80%" border="1" cellpadding="0" cellspacing="0">
<tr>
<td>关键字</td>
<td>区域</td>
<td>面积</td>
<td>租金</td>
<td>租赁类型</td>
<td>房屋类型</td>
</tr>
<?php
$tiaojian1=" 1=1 ";
$tiaojian2=" 1=1 ";
$tiaojian3=" 1=1 ";
$tiaojian4=" 1=1 "; if(!empty($_POST["area"])){
$attr1=$_POST["area"]; //通过area取到的是数组
$str1=implode("','",$attr1); //把数组拼接成字符串 因为sql语句中例如 select * from login code in('','','','');,所以用‘,’作为拼接符号把数组拼接成字符串
$tiaojian1=" area in ('$str1')";//直接把上面的字符串写到条件里
}
if(!empty($_POST["zu"])){
$attr2=$_POST["zu"];
$str2=implode("','",$attr2);
$tiaojian2=" zulinleixing in ('$str2')";
}
if(!empty($_POST["fangwu"])){
$attr3=$_POST["fangwu"];
$str3=implode("','",$attr3);
$tiaojian3=" fangwuleixing in ('$str3')";
}
if(!empty($_POST["guanjianzi"])){
$str4=$_POST["guanjianzi"];
$tiaojian4=" keyword like '%{$str4}%'";
}
$sql1="select * from fangzi where {$tiaojian1} and {$tiaojian2} and {$tiaojian3} and {$tiaojian4}";//把各个条件拼起来
$zattr=$db->Query($sql1);
foreach($zattr as $zv)
{
echo "<tr><td>{$zv[1]}</td><td>{$zv[2]}</td><td>{$zv[3]}</td><td>{$zv[4]}</td><td>{$zv[5]}</td><td>{$zv[6]}</td></tr>"; }
?>
</table>
4.通过js控制全选的选中状态
<script>
function quanxuan1(aa)
{ var attr=document.getElementsByClassName("area");
for(var i=0;i<attr.length;i++)
{
if(aa.checked) //判断全选复选框的选中状态
{
attr[i].setAttribute("checked","checked"); 给各个小复选框添加cheched=checked的属性 }
else
{
attr[i].removeAttribute("checked"); //给各个小复选框移除checked属性 }
}
} function quanxuan2(aa)
{ var attr=document.getElementsByClassName("zu");
for(var i=0;i<attr.length;i++)
{
if(aa.checked)
{
attr[i].setAttribute("checked","checked"); }
else
{
attr[i].removeAttribute("checked"); }
}
}
function quanxuan3(aa)
{ var attr=document.getElementsByClassName("fangwu");
for(var i=0;i<attr.length;i++)
{
if(aa.checked)
{
attr[i].setAttribute("checked","checked"); }
else
{
attr[i].removeAttribute("checked"); }
}
} </script>