n

Trong ví dụ này ta sẽ tạo một ô tìm kiếm, khi người dùng nhập vào ô tìm kiếm thì kết quả sẽ hiện ra ở dưới. Dữ liệu sẽ được php xử lí lấy từ database sau đó được gửi về trình duyệt xử lí.
Mình có cơ sở dữ liệu như sau :

mình tạo trang index gồm 1 ô seach và 1 bảng để hiển thị kết quả tìm kiếm

<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<title>Quốc Hùng IT</title>
		<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
		<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
		<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" />
	</head>
	<body>
		<div class="container">
			<br />
			<br />
			<br />
			<h2 align="center">Demo seach Ajax trong PHP MYSQL </h2><br />
			<div class="form-group">
				<div class="input-group">
					<span class="input-group-addon">Search</span>
					<input type="text" name="search_text" id="search_text" placeholder="Nhập từ cần tìm" class="form-control" />
				</div>
			</div>
			<br />
			<div id="result"></div>
		</div>
		<div style="clear:both"></div>
		<br />
		<br />
		<br />
		<br />
	</body>
</html>
<script>
$(document).ready(function(){
	load_data();
	function load_data(query)
	{
		$.ajax({
			url:"fetch.php",
			method:"post",
			data:{query:query},
			success:function(data)
			{
				$('#result').html(data);
			}
		});
	}
	$('#search_text').keyup(function(){
		var search = $(this).val();
		if(search != '')
		{
			load_data(search);
		}
		else
		{
			load_data();
		}
	});
});
</script>

mình sử lý phần hiển thị bảng và kết quả tìm kiếm
Như các bạn đã biết khi seach trong sql , câu lệnh like được sử dụng rất nhiều

SELECT * FROM tbl_customer
	WHERE CustomerName LIKE '%".$search."%'
	OR Address LIKE '%".$search."%'
	OR City LIKE '%".$search."%'
	OR PostalCode LIKE '%".$search."%'
	OR Country LIKE '%".$search."%'
	";

Mình có tổng quát file thứ 2 như sau

<?php
$connect = mysqli_connect("localhost", "ajax", "123456", "ajax");
mysqli_set_charset($connect , "utf8");
$output = '';
if(isset($_POST["query"]))
{
	$search = mysqli_real_escape_string($connect, $_POST["query"]);
	$query = "
	SELECT * FROM tbl_customer
	WHERE CustomerName LIKE '%".$search."%'
	OR Address LIKE '%".$search."%'
	OR City LIKE '%".$search."%'
	OR PostalCode LIKE '%".$search."%'
	OR Country LIKE '%".$search."%'
	";
}
else
{
	$query = "
	SELECT * FROM tbl_customer ORDER BY CustomerID";
}
$result = mysqli_query($connect, $query);
if(mysqli_num_rows($result) > 0)
{
	$output .= '<div class="table-responsive">
					<table class="table table bordered">
						<tr>
							<th>Customer Name</th>
							<th>Address</th>
							<th>City</th>
							<th>Postal Code</th>
							<th>Country</th>
						</tr>';
	while($row = mysqli_fetch_array($result))
	{
		$output .= '
			<tr>
				<td>'.$row["CustomerName"].'</td>
				<td>'.$row["Address"].'</td>
				<td>'.$row["City"].'</td>
				<td>'.$row["PostalCode"].'</td>
				<td>'.$row["Country"].'</td>
			</tr>
		';
	}
	echo $output;
}
else
{
	echo 'Data Not Found';
}
?>

Demo bằng video

Chúc các bạn thành công !…

Hiện nay web mình ít dung lượng lưu trữ nên các bài đăng có file tải về các bạn liên hệ tác giả để nhận nha. Thanks các bạn đã ghé thăm web :))
Quản trị viên tối cao : Quốc Hùng
Admin bí mật :Ẩn danh ( Sói cô đơn )

Chúc các bn mt ngày vui v ,nếu thy hay thì like và share nha các ban!...

Chào các bạn mình là Quốc Hùng , mình sinh ra thuộc cung song tử ,song tử luôn khẳng định chính mình ,luôn luôn phấn đấu vượt lên phía trước ,mình sinh ra và lớn lên tại vùng đất võ cổ truyền ,đam mê của mình là coder ,ngày đi học tối về viết blog ...