|
|
|
TIP : jQuery ajaxJSON+PHP+Mysql หวังว่าจะเป็นประโยชน์นะครับ |
|
|
|
|
|
|
|
หวังว่าจะเป็นประโยชน์นะครับ
Default.php
Code (PHP)
<!DOCTYPE html>
<html>
<head>
<style>
body{font-family:Arial; font-size:12px; background-color:#CCC;}
label{font-weight:bold; display:inline-block; width:100px; text-align:right;}
input#txt_name{width:200px; border:solid 1px #CCC;}
input#txt_name:focus{border:solid 1px #F90;}
select{width:200px;}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jQuery Search Application</title>
</head>
<body>
<form name="Myfrm">
<h2>Search Application.</h2>
<label>Name:</label>
<select name="DDl" id="DDl">
<option value="0">===***===</option>
<?php
$link = mysql_connect("localhost", "root", "") or die (mysql_error());
$sel_db = mysql_select_db("student", $link) or die(mysql_error());
$sql = "SELECT * FROM student_data";
$qr_sql = mysql_query($sql);
while($fetch = mysql_fetch_array($qr_sql)){
echo "<option value=\"".$fetch["ID_Stu"]."\">".$fetch["Name"]."</option>";
}
?>
</select> <input type="button" id="Btn" value="Get Data">
</form>
<hr>
<div id="showData"></div>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript">
$(function(){
$('#Btn').click(function(){
if($('#DDl').val() == 0){
alert(">___<");
$('#DDl').focus();
$('#showData').html('');
return false;
}
$.get("get_data.php?id_stu="+$('#DDl').val(), function(data){
$("#showData").html(
"<h2>Result Information.</h2>"+"<br>"+
"<b>Name:</b> "+data[0].Name+"<br>"+
"<b>Surename:</b> "+data[0].Surename+"<br>"+
"<b>Sex:</b> "+data[0].Sex+"<br>"+
"<b>Major:</b> "+data[0].Major+"<br>"+
"<b>Remark_stu:</b> "+data[0].Remark_stu+"<br>"
);
});
return false;
});
});
</script>
</body>
</html>
get_data.php
Code (PHP)
<?php
header("Content-type:application/json; charset=UTF-8");
header("Cache-Control: no-store, no-cache, must-revalidate");
header("Cache-Control: post-check=0, pre-check=0", false);
function Sex($val){
if($val == 1){
$Sex = "Male";
}else{
$Sex = "Female";
}
return $Sex;
}
function Major($val){
if($val == 1){
$Major = "Computer1";
}else if($var == 2){
$Major = "Computer2";
}else{
$Major = "Computer3";
}
return $Major;
}
mysql_connect("localhost","root","1234") or die("Cannot connect the Server");
mysql_select_db("student") or die("Cannot select database");
mysql_query("set character set utf8");
?>
<?php
$sql = "SELECT * FROM student_data WHERE ID_Stu = '".$_GET["id_stu"]."'";
$qr = mysql_query($sql);
while($rs = mysql_fetch_array($qr)){
$json_data[] = array(
"ID_Stu"=>$rs['ID_Stu'],
"Name"=>$rs['Name'],
"Surename"=>$rs['Surename'],
"Sex"=>Sex($rs['Sex']),
"Major"=>Major($rs['Major']),
"Remark_stu"=>$rs['Remark_stu'],
);
}
$json = json_encode($json_data);
echo $json;
?>
Code
-- phpMyAdmin SQL Dump
-- version 2.10.3
-- http://www.phpmyadmin.net
--
-- Host: localhost
-- Generation Time: Jul 10, 2012 at 11:41 PM
-- Server version: 5.0.51
-- PHP Version: 5.2.6
SET SQL_MODE="NO_AUTO_VALUE_ON_ZERO";
--
-- Database: `student`
--
-- --------------------------------------------------------
--
-- Table structure for table `student_data`
--
CREATE TABLE `student_data` (
`ID_Stu` int(5) NOT NULL auto_increment,
`Name` varchar(100) collate utf8_unicode_ci NOT NULL,
`Surename` varchar(100) collate utf8_unicode_ci NOT NULL,
`Sex` int(5) NOT NULL,
`Major` int(5) NOT NULL,
`Remark_stu` text collate utf8_unicode_ci NOT NULL,
PRIMARY KEY (`ID_Stu`)
) ENGINE=MyISAM DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci AUTO_INCREMENT=10 ;
--
-- Dumping data for table `student_data`
--
INSERT INTO `student_data` VALUES (5, 'Geidtiphong', 'Singseewo', 2, 3, 'ทดสอบค่ะ');
INSERT INTO `student_data` VALUES (6, 'Geidtiphong1', 'Singseewo1', 2, 3, 'ทดสอบระบบ');
INSERT INTO `student_data` VALUES (7, 'Geidtiphong2', 'Singseewo2', 2, 3, 'Testing system.');
INSERT INTO `student_data` VALUES (8, 'Geidtiphong3', 'Singseewo3', 1, 2, 'ทดสอบระบบ');
INSERT INTO `student_data` VALUES (9, 'Geidtiphong4', 'Singseewo4', 1, 2, 'Testing system !!!');
ผมทดลอง FF, Chrome, IE ได้ผลดีครับ
Tag : PHP, MySQL, Ajax, jQuery
|
|
|
|
|
|
Date :
2012-07-10 22:47:45 |
By :
popnakub |
View :
1122 |
Reply :
4 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
ขอบคุณครับพี่ เอ่อผมขอถามอีกอย่างหน่อยนะครับ ถ้าเราจะทำแบ่งหน้าด้วย JSON หนิน่าจะได้ไหมครับ หรือ เหมาะกับแสดงข้อมูลระหว่างข้อมูลผ่าน Server ในประมาณไม่มากใช่ไหมครับเช่นพวก Auto Complete อะไรทำนองนี้มากกว่าใช่ไหมครับ รบกวนแนะนำด้วยครับ
|
ประวัติการแก้ไข 2012-07-11 09:16:57 2012-07-11 09:17:03 2012-07-11 09:17:08
|
|
|
|
Date :
2012-07-11 09:16:29 |
By :
popnakub |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
แบบนั้นไม่เหมาะครับ
|
|
|
|
|
Date :
2012-07-11 20:52:39 |
By :
mr.win |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
ครับพี่ ขอบคุณที่แนะนำครับ
|
|
|
|
|
Date :
2012-07-12 09:54:16 |
By :
popnakub |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
Load balance : Server 03
|