zoukankan      html  css  js  c++  java
  • 租房子ajax

    首页:

    <?php
    //连接数据库
    $db = new MySQLi('localhost','root','123','php0307');
    !mysqli_connect_error() or die('连接错误');
    $db->query('set names utf8');
    
    if(isset($_GET['id'])){
        //删除语句
        $sql = "delete from h_house where id=".$_GET['id'];
        //执行sql语句
        $res = $db->query($sql); 
    }
    //mysql语句
    $sql = "select * from h_house";
    // 执行mysql语句
    $res = $db->query($sql);
    //变成一个二维数组
    $arr = $res->fetch_all();
    ?>
    <!doctype html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>列表页</title>
    </head>
    <body>
    <table width="100%" border="1" cellpadding="0" cellspacing="0">
        <tr>
            <th>操作</th>
            <th>关键字</th>
            <th>区域</th>
            <th>使用面积</th>
            <th>租金</th>
            <th>租赁类型</th>
            <th>房屋类型</th>
        </tr>
        <?php foreach($arr as $v){ ?>
          <tr>
                <td>
                <a href="addmid.php?id=<?php echo $v[0] ?>">编辑</a>
                <a href="manage.php?id=<?php echo $v[0] ?>">删除</a>
            </td>
            <td><?php echo $v[1]; ?></td>
            <td><?php echo $v[2]; ?></td>
            <td><?php echo $v[3]; ?></td>
            <td><?php echo $v[4]; ?></td>
            <td><?php echo $v[5]; ?></td>
            <td><?php echo $v[6]; ?></td>
          </tr>
    <?php }?>
    </table>
    <a href="addmid.php"><button>添加</button></a>
    </body>
    </html>
    View Code

    修改页面:

     1 <?php
     2 //连接数据库
     3 $db = new MySQLi('localhost','root','123','php0307');
     4 !mysqli_connect_error() or die('连接错误');
     5 $db->query('set names utf8');
     6 //设一边变量为false
     7 $flag = false;
     8 //判断是否获取到了$_GET['id']
     9 if(isset($_GET['id'])){
    10     //当获取到值的时候为true
    11     $flag = true;
    12     //mysql语句 让id 等于 穿过来的id
    13     $sql = "select * from h_house where id=".$_GET['id'];
    14     $res = $db->query($sql);
    15     $arr = $res->fetch_row();
    16 }
    17 if(isset($_POST['keyword'])){//判断是否有提交
    18     $keyword = $_POST['keyword'];//关键字
    19     $area = $_POST['area'];//区域
    20     $sqmeter = $_POST['sqmeter'];//使用面积
    21     $rent = $_POST['rent'];//租金
    22     $rentType = $_POST['rentType'];//租赁类型
    23     $housetype = $_POST['housetype'];//房屋类型
    24     //判断是否提交 或者 不为空
    25 if(isset($_POST['id']) && $_POST['id'] != ""){
    26         //修改语句
    27         $sql = "update h_house set keyword='$keyword',area='$area',sqmeter='$sqmeter',rent='$rent',rentType='$rentType',housetype='$housetype' where id=".$_POST['id'];
    28         $res = $db->query($sql);
    29     //添加
    30     }else{
    31         $sql = "insert into h_house(keyword,area,sqmeter,rent,rentType,housetype) values('$keyword','$area','$sqmeter','$rent','$rentType','$housetype')";
    32         $res = $db->query($sql);
    33     }
    34 }
    35 ?>
    36 <!doctype html>
    37 <html>
    38 <head>
    39 <meta charset="utf-8">
    40 <title>无标题文档</title>
    41 </head>
    42 <body>
    43 <form action="addmid.php" method="post">
    44   <input type="hidden" name="id" value="<?php echo $flag ? $arr[0] : "" ?>">
    45     <table width="260" cellpadding="0" cellspacing="0">
    46         <tr>
    47             <td>关键字:</td>
    48             <td><input name="keyword" value="<?php echo $flag ? $arr[1] : "" ?>"</td>
    49         </tr>
    50         <tr>
    51             <td>区域:</td>
    52             <td><input name="area" value="<?php echo $flag ? $arr[2] : "" ?>"</td>
    53         </tr>
    54         <tr>
    55             <td>使用面积:</td>
    56             <td><input name="sqmeter" value="<?php echo $flag ? $arr[3] : "" ?>"</td>
    57         </tr>
    58         <tr>
    59             <td>租金:</td>
    60             <td><input name="rent" value="<?php echo $flag ? $arr[4] : "" ?>"</td>
    61         </tr>
    62         <tr>
    63             <td>租赁类型:</td>
    64             <td><input name="rentType" value="<?php echo $flag ? $arr[5] : "" ?>"</td>
    65         </tr>
    66         <tr>
    67             <td>房屋类型:</td>
    68             <td><input name="housetype" value="<?php echo $flag ? $arr[6] : "" ?>"</td>
    69         </tr>
    70         <tr>
    71             <td colspan="2">
    72                 <button>插入</button>
    73                 <a href="manage.php">返回</a>
    74             </td>
    75         </tr>
    76     </table>
    77 </form>
    78 </body>
    79 </html>
    View Code

    列表页:

      1 <!doctype html>
      2 <html>
      3 <head>
      4 <meta charset="utf-8">
      5 <title>列表页</title>
      6 <script type="text/javascript" src="jquery-3.2.1.min.js"></script>
      7 </head>
      8 <body>
      9     区域:<div id="area"></div>
     10     租赁类型:<div id="rent"></div>
     11     房屋类型:<div id="house"></div>
     12     关键字:<input type="text" name="kwd"><br>
     13     <button onClick="addEvent()">查询</button>
     14 <table id="tabl" width="100%" border="1" cellpadding="0" cellspacing="0">
     15 </table>
     16 </body>
     17 </html>
     18 <script>
     19 $(function(){
     20     //发起ajax请求数据 
     21     ajaxFun();
     22 })
     23 function addEvent(){
     24     //创建对象
     25     var xhr = new XMLHttpRequest();
     26     //post的传值方式   创建请求
     27     xhr.open('post','chuli.php?type=query');
     28     //post传值得加头信息
     29     xhr.setRequestHeader('content-type','application/x-www-form-urlencoded');
     30     var quyu = '';    //区域
     31     var rent = '';//租赁类型
     32     var house = '';//房屋类型
     33     var kwd = '';//关键字
     34     var info = '';//传值
     35     $('input[name="area"]:checked').each(function(){
     36         quyu += $(this).val()+"','";
     37     })
     38     $('input[name="rent"]:checked').each(function(){
     39         rent += $(this).val()+"','";
     40     })
     41     $('input[name="house"]:checked').each(function(){
     42         house += $(this).val()+"','";
     43     })
     44     kwd = $('input[name="kwd"]').val();
     45     //让他们相等 赋值给info
     46     info = "area="+quyu+"&rent="+rent+"&house="+house+"&kwd="+kwd;
     47     //发送请求
     48     xhr.send(info);
     49     //监听ajax状态
     50     xhr.onreadystatechange = function(){
     51         //判断当他满足条件状态等于4的时候 数据是ajax数据全部返回
     52         if(xhr.readyState == 4){
     53             //定义一个变量把返回值赋值给他
     54             var data = xhr.responseText;
     55             //处理数据
     56             listFun(data);
     57         }
     58     }
     59 }
     60 /* 发起ajax请求数据  区域 租赁类型 房屋类型 房源列表*/
     61 function ajaxFun(){
     62     //创建对象
     63     var xhr = new XMLHttpRequest();
     64     //监听ajax状态
     65     xhr.onreadystatechange = function(){
     66         //判断 当他满足条件状态等于4的时候 数据ajax数据全部返回
     67         if(xhr.readyState == 4){
     68             //定义一个变量把返回值赋值给他
     69             var data = xhr.responseText;
     70             //处理数据
     71             chuiliData(data);
     72         }
     73     }
     74     //get传值 带个参数type=init 让php页面接收
     75     xhr.open('get','chuli.php?type=init');
     76     //发送请求
     77     xhr.send(null);
     78 }
     79 /*处理返回数据*/
     80 function chuiliData(data){
     81     //定义一个变量来接收数组并以@拆分
     82     var arr = data.split('@');
     83     //区域
     84     areaFun(arr[0]);
     85     //租赁类型
     86     rentFun(arr[1]);
     87     //房屋类型 
     88     houseFun(arr[2]);
     89     //房源列表
     90     listFun(arr[3]);
     91 }
     92 //区域的内容
     93 function areaFun(data){
     94     //定义一个变量接收数组 并以^拆分
     95     var arr = data.split('^');
     96     //定义一个变量为空
     97     var str = '';
     98     //循环 数组
     99     for(var i=0;i<arr.length;++i){
    100         // 建input type为checkbox 加了一个label在点击文字的时候也可以选中 赋值给str
    101         str += '<label><input type="checkbox" name="area" value="'+arr[i]+'">'+arr[i]+'</label>&nbsp;&nbsp;';
    102     }
    103     //找到id我area的div 让他的内容为str
    104     $('#area').html(str);
    105 }
    106 //租赁类型的内容
    107 function rentFun(data){
    108     var arr = data.split('^');
    109     var str = '';
    110     for(var i=0;i<arr.length;++i){
    111         str += '<label><input type="checkbox" name="rent" value="'+arr[i]+'">'+arr[i]+'</label>&nbsp;&nbsp;';
    112     }
    113     $('#rent').html(str);
    114 }
    115 //房屋类型的内容
    116 function houseFun(data){
    117     var arr = data.split('^');
    118     var str = '';
    119     for(var i=0;i<arr.length;++i){
    120         str += '<label><input type="checkbox" name="house" value="'+arr[i]+'">'+arr[i]+'</label>&nbsp;&nbsp;';
    121     }
    122     $('#house').html(str);
    123 }
    124 //房源列表的内容
    125 function listFun(data){
    126     //定义一个变量接收并以^开芬
    127     var arr = data.split('^');
    128     var str = `<tr>
    129                 <th>关键字</th>
    130                 <th>区域</th>
    131                 <th>使用面积</th>
    132                 <th>租金</th>
    133                 <th>租赁类型</th>
    134                 <th>房屋类型</th>
    135                </tr>`;
    136     //循环数组
    137     for(var i=0;i<arr.length;++i){
    138         //定义一个变量 吧数组里面的内容以逗号拆分
    139         var brr = arr[i].split(',');
    140         //标签拼接 开头
    141         str += '<tr>';
    142         //循环从1开始
    143         for(var j=1;j<brr.length;++j){
    144             //捣鼓一个td标签 拼接上循环出来的内容
    145             str += '<td>'+brr[j]+'</td>';
    146         }
    147         //标签拼接 结尾
    148         str += '</tr>';
    149     }
    150     //找到id为tabl的table 让他的内容等于str
    151     $('#tabl').html(str);
    152 }
    153 </script>
    View Code

    处理页面:

     1 <?php
     2 //连接数据库
     3 $db = new MySQLi('localhost','root','123','php0307');
     4 !mysqli_connect_error() or die('连接错误');
     5 $db->query('set names utf8');
     6 
     7 $type = $_GET['type'];
     8 switch($type){
     9 //type 穿的第一个参数
    10     case 'init':
    11             //区域
    12             $sql = "select distinct area from h_house";
    13             $res = $db->query($sql);
    14             $arrone = $res->fetch_all();
    15             //租赁类型
    16             $sql = "select distinct rentType from h_house";
    17             $res = $db->query($sql);
    18             $arrtwo = $res->fetch_all();
    19             //房屋类型
    20             $sql = "select distinct housetype from h_house";
    21             $res = $db->query($sql);
    22             $arrthree = $res->fetch_all();
    23             //房源列表
    24             $sql = "select * from h_house";
    25             $res = $db->query($sql);
    26             $arrfour= $res->fetch_all();
    27             // 区域  租赁类型   房屋类型  房源列表
    28             echo arrToString($arrone)."@".arrToString($arrtwo)."@".arrToString($arrthree)."@".arrToString($arrfour);
    29         break;
    30 //type 穿的第二个参数
    31     case 'query':
    32         $area = $_POST['area'];//区域
    33         $rent = $_POST['rent'];//租赁类型
    34         $house = $_POST['house'];//房屋类型
    35         $kwd = $_POST['kwd'];//关键字
    36         
    37         $str = "where 1=1 ";
    38         if($area != ""){
    39             //去掉 拼接的','
    40             $area = substr($area,0,-3);
    41             $str .= " and area in ('$area') ";
    42         }
    43         if($rent != ""){
    44             $rent = substr($rent,0,-3);
    45             $str .= " and rentType in ('$rent') ";
    46         }
    47         if($house != ""){
    48             $house = substr($house,0,-3);
    49             $str .= " and houseType in ('$house') ";
    50         }
    51         if($kwd != ""){
    52             $str .= " and keyword like '%$kwd%' ";
    53         }
    54         $sql = "select * from h_house $str";
    55         $res = $db->query($sql);
    56         $arr= $res->fetch_all();
    57         echo arrToString($arr);
    58         break;        
    59 }
    60 function  arrToString($arr){
    61     $str = '';
    62     foreach($arr as $k=>$v){
    63         foreach($v as $vv){ 
    64             $str .= $vv.",";
    65         }
    66         $str = substr($str,0,-1);
    67         $str .= '^';
    68     }
    69     $str = substr($str,0,-1);
    70     return $str;
    71 }
    View Code
  • 相关阅读:
    Windows Server 2012配置开机启动项
    Windows Server 2019 SSH Server
    NOIP2017 senior A 模拟赛 7.7 T1 棋盘
    Noip 2015 senior 复赛 Day2 子串
    Noip 2015 senior复赛 题解
    Noip 2014 senior Day2 解方程(equation)
    Noip 2014 senior Day2 寻找道路(road)
    Noip 2014 senior Day2 无线网络发射器选址(wireless)
    Noip2014senior复赛 飞扬的小鸟
    Noip 2014 senior 复赛 联合权值(link)
  • 原文地址:https://www.cnblogs.com/xzz123-/p/9041713.html
Copyright © 2011-2022 走看看