|
|
|
การ search แบบ ajax ครับ อยากให้พิมพ์ในช่องแล้วเริ่มค้นหาเลยครับ ไม่ต้องกด submit |
|
|
|
|
|
|
|
โค้ดเป็ฯแบบด้านล่างครับ ตอนนี้ คือพิมพ์ในช่องแล้วกด ปุ่มค้นหา ก็จะหาตามที่เราพิมพ์ แต่ ที่อยากทำคือ อยากให้พิมพ์แล้วมันค้นหาเลยทันทีโดยไม่ต้องกดปุ่ม submit ครับ ท่านใดพอช่วยเหลือผมได้บ้างครับ ไม่รู้ว่าใช่แบบ ajax หรือเปล่า ขอคำแนะนำด้วยครับ
Code (PHP)
<?
error_reporting(E_ALL ^ E_NOTICE);
session_start();
include "include/cnmysql.php";
$frmAction=$_POST["frmAction"];
$search=$_POST["search"];
if($search=="")
{$search=$_GET["search"];}
$page=$_GET["page"];
if($page==""){$page=1;}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>IRBEAUTINA</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="css/style.css" type="text/css" media="all" />
<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="js/jquery.jcarousel.js"></script>
<script type="text/javascript" src="js/cufon-yui.js"></script>
<script type="text/javascript" src="js/MyriadPro.font.js"></script>
<script type="text/javascript" src="js/ArialBold.font.js"></script>
<script type="text/javascript" src="js/jquery-func.js"></script>
<link rel="shortcut icon" type="image/x-icon" href="css/images/iconir.jpg" />
<!--[if IE 6]><link rel="stylesheet" href="css/ie.css" type="text/css" media="all" /><![endif]-->
</head>
<body onLoad="document.form1.search.focus();">
<? include "header2012.php";?>
<form name="form1" method="post">
<div id="main">
<div class="shell">
<div class="box1">
<? include "leftmenu2012.php";?>
<div id="Bgnew">
<div id="NewCol">
<a href="#"><img class="img1" width="200px" height="140px" src="css/images/1pic1.jpg"/></a>
</div>
<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/th_TH/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="fb-like-box" data-href="http://www.facebook.com/pages/IR-BEAUTINA/214147611982068" data-width="218" data-height="300" data-show-faces="true" data-stream="false" data-header="true"></div>
</div>
</div>
<div class="box3">
<div class="ContentAb">
<div class="Bannerpai">
<p style="padding:8px 0 0 30px;font-weight:bold;color:#ffffff;text-shadow:1px 0px 1px black">ท่านสามารถเห็น BV / PV ได้เมื่อ ล็อคอินแล้ว ค้นหาสินค้า
<input name="search" type="text" id="search" value="<? echo $search;?>">
<input class="copy" type="submit" onclick="goSearch()" value="ค้นหา" name="Submit"> เข้าสู่หน้าสมาชิก </p>
</div>
<br/><br/><table class="centerpi" border="1" width="650px">
<tr>
<th>รหัสสินค้า</th>
<th>ชื่อสินค้า</th>
<? if($_SESSION["hcode"]!=""){?>
<th>ราคา</th>
<th>BV</th>
<th>PV</th>
<? }?>
</tr>
<?
$i=0;
if($search=="")
{$sql="select * from product where productid like '%$search%' or productname like '%$search%' order by productid";}
else{$sql="select * from product where productid like '%$search%' or productname like '%$search%' order by productid";}
mysql_query("SET NAMES UTF8");
$recordperpage=30;
$result = mysql_query($sql);
$totalrecord=mysql_num_rows($result);
$totalpage = ceil($totalrecord / $recordperpage);
$start_from = ($page-1) * $recordperpage;
$sql=$sql." limit $start_from,$recordperpage";
$result = mysql_query($sql);
while ($row = mysql_fetch_array($result, MYSQL_ASSOC)) {
$i+=1;
$description=$row["description"];
if($i%2==0){$bgcolor="cacfcd";}
else{$bgcolor="b5b8b7";}
?>
<tr>
<td width="63" bgcolor="#<? echo $bgcolor;?>"><? echo $row["productid"];?></td>
<td width="387"bgcolor="#<? echo $bgcolor;?>"><? echo $row["productname"];?></td>
<? if($_SESSION["hcode"]!=""){?>
<td width="55"bgcolor="#<? echo $bgcolor;?>"><? echo $row["price"];?>.-</td>
<td width="57"bgcolor="#<? echo $bgcolor;?>"><? echo $row["bv"];?></td>
<td width="54"bgcolor="#<? echo $bgcolor;?>"><? echo $row["pv"];?></td>
</tr>
<? }}?>
</table>
<br/><div class="Navipro">
<p class="Navifont"><? for ($i=1; $i<=$totalpage; $i++)
{
if($page!=$i){ echo "<a href=pricelist.php?&search=$search&page=$i>";}
echo $i;
if($page!=$i){ echo "</a>";}
echo " | ";
}?></p>
</div><br/>
<div class="clear1">
</div>
</div>
</div>
</div>
<div class="cl"> </div>
</div>
</div>
</form>
<? include "footer2012.php";?></body>
</html>
Tag : PHP, MySQL, Ajax
|
|
|
|
|
|
Date :
2012-03-16 11:10:25 |
By :
onekisz |
View :
8613 |
Reply :
6 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
Code (PHP)
<script>
$(function(){ // เรียกใช้ตอนโหลดหน้าเสร็จ
$("#searhbox").keyup(function(){ // ถ้ามี keyup ที่ input ID = searchbox
if($(this).val().length>3) // ถ้าค่าใน searchbox ยาวกว่า 3
{
$.post("search.php",{key:$(this).val()},function(result){ /// ส่งค่าไปที่ search.php แบบ post ตัวแปร key เก็บค่า searchbox
$("#resultDiv").html(result); // เอาค่าที่ส่งกลับมา แสดงที่ element ที่มี id = resultDiv
})
}else{
return false; // ถ้าค่าใน searchbox น้อยกว่า 3 ไม่ต้องทำไร
}
})
})
</script>
|
|
|
|
|
Date :
2012-03-16 11:25:39 |
By :
randOmizE |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
ขอโทษนะครับผม ขอถามต่อ แล้วโค้ดที่พี่ให้มา ผมต้องเอาไปใ้ต่อยังไงครับ มือใหม่อ่ะครับ
|
|
|
|
|
Date :
2012-03-16 11:36:24 |
By :
onekisz |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
เอาไปใช้แบบนี้ครับ
Code (PHP)
<html>
<head>
<title>test Ajax Post</title>
<meta charset="utf-8" />
<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script> // ดึง jquery มา
<script>
$(function(){ // เรียกใช้ตอนโหลดหน้าเสร็จ
$("#searhbox").keyup(function(){ // ถ้ามี keyup ที่ input ID = searchbox
if($(this).val().length>3) // ถ้าค่าใน searchbox ยาวกว่า 3
{
$.post("search.php",{key:$(this).val()},function(result){ /// ส่งค่าไปที่ search.php แบบ post ตัวแปร key เก็บค่า searchbox
$("#resultDiv").html(result); // เอาค่าที่ส่งกลับมา แสดงที่ element ที่มี id = resultDiv
})
}else{
return false; // ถ้าค่าใน searchbox น้อยกว่า 3 ไม่ต้องทำไร
}
})
})
</script>
</head>
<body>
<input type="text" id="searhbox">
<div id="resultDiv">ผลการค้นหาออกตรงนี้</div>
</body>
</html>
หน้า search.php
Code (PHP)
<?php
echo $_POST['key']; //รับค่า
/* จะทำอะไรต่อก็ ............... */
?>
|
|
|
|
|
Date :
2012-03-16 12:38:59 |
By :
randOmizE |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
แหะๆ แบบว่าเอาไปใช้แล้วทำไม่ได้ครับ แย่จัง TT_TT ผมใช้ไม่เปง
|
|
|
|
|
Date :
2012-03-16 15:50:00 |
By :
onekisz |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
ที่บอกว่าเอาไปใช้ไม่ได้ มีไฟล์ js/jquery-1.4.2.min.js" หรือยังครับ
|
|
|
|
|
Date :
2012-03-17 18:42:01 |
By :
asustak |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
Date :
2014-04-25 14:38:04 |
By :
aaa |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
Load balance : Server 04
|