Bootstrap EP.20(ตอนที่1) โปรแกรมค้นหาข้อมูลแบบหลายเงือนไข(Multi Search)
Bootstrap EP.20(ตอนที่1) โปรแกรมค้นหาข้อมูลแบบหลายเงือนไข(Multi Search)
ในการค้นหาข้อมูลหากค้นหาแบบช่องเดียวโดยไม่มีการกรอง ข้อมูลที่ค้น
ก็จะออกมาทั้งหมดที่มีคำค้น แต่หากค้นหาแบบละเอียด มีตัวกรองคำค้น
ก็จะได้ข้อมูลที่ปม้นยำมากขึ้น
คลิ๊กดูวีดีโอได้เลย
multi.php
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 |
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Multi Search</title> <!-- Bootstrap --> <link href="css/bootstrap.min.css" rel="stylesheet"> <link href="css/fordev22.css" rel="stylesheet"> </head> <body> <br /> <br /> <br /> <br /> <br /> <br /> <div class="container"><!--เนื้อหา1--> <div class="row"><!--เปิดrow1--> <div id="box1" class=" col-sm-12 col-md-12"> <table width="100%" border="0" align="center" cellpadding="0" cellspacing="1"> <tr> <td align="center" bgcolor="#FFFFFF"><p>ระบบค้นหาแบบหลายเงื่อนไข(Multi Search ตอนที่ 1)</p></td> </tr> </table> </div> </div> <!--ปิดrow1--> </div> <div class="container"> <form id="form1" name="form1" class="form-horizontal" method="post" action="multi_ok.php"> <div class="row"> <label class="col-xs-12 col-sm-4 col-md-4 control-label"> name : </label> <div class="col-xs-12 col-sm-4 col-md-4"> <input name="name" type="text" class="form-control" id="name" > </div> * จำเป็นต้องกรอก * </div> <br /> <div class="row"> <label class="col-xs-12 col-sm-4 col-md-4 control-label"> city : </label> <div class="col-xs-12 col-sm-4 col-md-4"> <input name="city" type="text" class="form-control" id="city" > </div> * จำเป็นต้องกรอก * </div> <br /> <br /> <label for="" class="col-xs-12 col-sm-4 col-md-4 control-labell"></label> <div class="col-xs-12 col-sm-4 col-md-4"> <button type="submit" class="btn-1 btn-primary btn-lg btn-block"><span class="glyphicon glyphicon-search"> ค้นหาข้อมูล</span></button> </form> </div> <!-- jQuery (necessary for Bootstrap's JavaScript plugins) --> <script src="js/jquery-1.11.2.min.js"></script> <!-- Include all compiled plugins (below), or include individual files as needed --> <script src="js/bootstrap.min.js"></script> </body> </html> |
multi_ok.php
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 |
<?php include('Connections/fordev22_db1.php');?> <!--เชื่อมต่อไฟล์connect--> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> </head> <body> <table align="center" width="50%" border="1" cellspacing="1" cellpadding="1"> <tr> <td align="center">name</td> <td align="center">city</td> </tr> <?php echo "<pre>"; print_r($_POST); echo "</pre>"; ?> <?php //รับค่าตัวแปร $name = $_POST['name']; $city = $_POST['city']; //เรียกข้อมูลจาก database ใช้ and เป็นตัวเชื่อม $strsql = " SELECT * FROM teble1 where name like '%".$name."%' and city like '%".$city."%' "; //คำสั่งให้เลือกข้อมูลจาก TABLE ชื่อ table1 $result = mysql_query($strsql) or trigger_error(mysql_error()); while($row = mysql_fetch_array($result)) //สร้างตัวแปร $row มารับค่าจากการ fetch array เรียกreccord เปิด while loop { ?> <tr> <!--เรียกตัวแปรพร้อมฟิวที่จะให้แสดงคือname--> <td align="center"><?php echo $row['name'];?></td> <!--เรียกตัวแปรพร้อมฟิวที่จะให้แสดงคือcity--> <td align="center"><?php echo $row['city'];?></td> </tr> <?php }?> <!--//ปิด } while Loop--> </table> </body> </html> |