เจอปัญหาการ Load ข้อมูลจาก Database แบบ Real Time ด้วย PHP+Ajax jQuery ครับ มันไม่ยอมแสดงข้อมูลครับ
ตามหัวข้อเลยครับ ทั้งๆที่ในฐานข้อมูลก็มีข้อมูลอยู่แต่มันไม่ยอมแสดงข้อมูลนะสิครับ นี่โค้ดครับ
ปล.อ้างอิงค์จากบทความ https://www.thaicreate.com/community/jquery-get-load-data-real-time.html
เพิ่มเติมครับ ดูหน้าเว็บที่มัปัญหาได้ที่ Code
http://www.zohind.com/project/chatroom
ครับ
ไฟล์ getmsg.php
Code (PHP)
<?php
include '../config.php';
$sql = "SELECT * FROM pj_chat WHERE 1 ORDER BY id ASC";
$query = mysql_query($sql);
$intNumField = mysql_num_fields($query);
$resultarray = array();
while($result = mysql_fetch_array($query)){
$arrCol = array();
for($i=0;$i<$intNumField;$i++){
$arrCol[mysql_field_name($query,$i)] = $result[$i];
}
array_push($resultarray,$arrCol);
}
echo json_encode($resultarray);
?>
ไฟล์ index.php
Code (PHP)
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>"DEMO"</title>
<script src="js/jquery-1.11.1.min.js"></script>
<script>
function getDataFromDb(){
$.ajax({
url: "getmsg.php" ,
type: "POST",
data: ''
})
success(function(result) {
var obj = jQuery.parseJSON(result);
if(obj != ""){
//$("#myTable tbody tr:not(:first-child)").remove();
$("#tblbody").empty();
$.each(obj, function(key, val) {
var tr = "<tr>";
tr = tr + "<td>" + val["datetime"] + "</td>";
tr = tr + "<td>" + val["user"] + "</td>";
tr = tr + "<td>" + val["msg"] + "</td>";
tr = tr + "</tr>";
$('#tbltable > tbody:last').append(tr);
});
}
});
}
setInterval(getDataFromDb, 500); // 1000 = 1 second
</script>
</head>
<body>
<div align="center">
<h2>"DEMO" Chat Room</h2>
<table width="650" border="0" id="tbltable">
<thead>
<tr>
<td width="100"><div align="center">Datetime</div></td>
<td width="100"><div align="center">User</div></td>
<td width="450"><div align="center">Massage</div></td>
</tr>
</thead>
<tbody id="tblbody"></tbody>
</table>
</body>
</html>
Tag : PHP, MySQL, HTML/CSS, Ajax, jQuery
ประวัติการแก้ไข 2014-06-19 19:50:13 2014-06-19 19:51:24
Date :
2014-06-19 19:48:36
By :
kuzaa516
View :
2233
Reply :
17
ในไฟล์ getmsg.php บรรทัดที่3 น่าจะมีปัญหาตรง where l
เพราะมันควรจะต้อง เป็น where l = ?? อะไรซะอย่างนึง
ประวัติการแก้ไข 2014-06-19 20:09:14
Date :
2014-06-19 20:08:26
By :
Alan
ก่อนอื่น คุณเรียก getmsg.php ตรงๆ จาก web browser เลยครับ
ให้มัน โชว์ json_encode ก่อนครับ วา่ได้ข้อมูลตามที่ต้องการหรือเปล่า
ปล. where 1 ไม่ต้องใส่ก็ได้ครับ มันเป็นแค่ตัวอย่าง เท่านี้นครับ แต่ก็ไม่ผิด ที่จะใส่
การใช้ where 1 เพื่อบอกว่าเป็นจริง
แต่ถ้า ใช้ where 0 เป็นการ ทดสอบ ไวยกรณ์ในการเรียก แต่ไม่ต้องการ ผลลัพธ์ใดๆ ทั้งสิ้น
เพราะ ถือว่าเป็น เท็จ
ตัวอย่าง where 0
select * from tb where (ตัวเปรียบเทียบ ที่ต้องการ) and 0
ด้วยคำสังนี้ สามารถตรวจสอบ ไวยกรณ์ ของ where clause ต้วอื่นๆ ได้ โดยไม่ต้องยุ่งกับ ข้อมูลจริง
ประวัติการแก้ไข 2014-06-19 20:16:39 2014-06-19 20:22:52
Date :
2014-06-19 20:14:42
By :
Chaidhanan
ตอบท่าน >> Alan
1 ครับไม่ใช่ l ดูโค๊ดตามอ้างอิงค์เลยครับ เขามางี้อะครับ เท่าที่ผมเข้าใจคือ ให้ Select ข้อมูลจาก .... เมื่อ 1 โดยเรียงแบบ ASC ครับ
ตอบท่าน >> Chaidhanan
ได้ข้อมูลตามต้องการครับ แต่หน้า index ที่ทำ jQuery ให้ Realtime ข้อมูลไม่ขึ้นครับ
Date :
2014-06-19 20:19:35
By :
kuzaa516
อยากบอกว่า การดึงข้อมูล จากฐานข้อมูล Real Time แบบนี้ SERVER ทำงานหนักแน่ครับ
อีกทั้งยิ่งทำระบบ chat แบบนี้ ในกรณีที่มี USER เข้ามาเยอะๆ SERVER ไม่ไหวแน่ๆ
เพราะ คนนึง ก็ต้องติดต่อฐานข้อมูล INSERT , SELECT ตลอดเวลา
**ไม่แนะนำให้เก็บข้อมูล ไว้ในฐานข้อมูลแบบนี้ แนะนำให้เขียนเก็บลงไฟล์ดีกว่า
Date :
2014-06-19 20:30:27
By :
FreshyMusiC
คือต้องบอกก่อนครับ ผมไม่ชำนาญกับ jquery นะครับ ผมโปรแกรมเมอร์ โบราณครับ พวก tool สมัยใหม่ไม่ค่อยคล่องนะครับ
ที่บันทัดนี้ครับ
24 $('#tbltable > tbody:last').append(tr); // ลองเช็คคำสั่งนี้ครับ ว่ามันทำอะไร
// เป็นการ create table ใหม่หรือเปล่าครับ เพราผมไม่เห็น id="tbltable" ที่ตรงไหนเลยครับ
// เห็นแต่ id="tblbody"
ถ้าถูกต้อง ลองย้าย <script> ... </script> ทั้งหมด ไปไว้ ก่อน </body> ครับ
(ตัวที่เป็น file script ไม่ต้องครับ )
ผมเคยเจอปัญหา มันหา element ที่ต้องการไม่เจอครับ เพราะ script อยู่นอก body
Date :
2014-06-19 20:45:42
By :
Chaidhanan
18. $.each(obj, function(key, val) {
19. var tr = "<tr>";
20. tr = tr + "<td>" + val["datetime"] + "</td>";
21. tr = tr + "<td>" + val["user"] + "</td>";
22. tr = tr + "<td>" + val["msg"] + "</td>";
23. tr = tr + "</tr>";
24. $('#tbltable > tbody:last').append(tr);
25. });
26. }
27. });
งั้นแก้ เป็นนี่เลยครับ
Code (JavaScript)
var tr_index=1;
var tb=document.getElementById('tbltable');
var tb_row;
$.each(obj, function(key, val) {
tb_row = tb.insertRow(tr_index);
tb_row.insertCell(0).innerHTML=val["datetime"];
tb_row.insertCell(1).innerHTML=val["user"];
tb_row.insertCell(2).innerHTML=val["msg"];
tr_index++;
});
เอาแบบวิชาหากินดั้งเดิมเลยก็แล้วกันนะครับ โมฯเอาเองง่ายกว่าเยอะสำหรับผม
ประวัติการแก้ไข 2014-06-19 22:08:55 2014-06-19 22:11:18
Date :
2014-06-19 22:08:14
By :
Chaidhanan
Code (PHP)
<script type="text/javascript">
function getDataFromDb(){
$.ajax({
url: "getmsg.php" ,
type: "POST",
data: "",
success: function(result){
var obj = jQuery.parseJSON(result);
if(obj != ""){
//$("#myTable tbody tr:not(:first-child)").remove();
$("#tblbody").empty();
$.each(obj, function(key, val) {
var tr = "<tr>";
tr = tr + "<td>" + val["datetime"] + "</td>";
tr = tr + "<td>" + val["user"] + "</td>";
tr = tr + "<td>" + val["msg"] + "</td>";
tr = tr + "</tr>";
$('#tbltable > tbody:last').append(tr);
});
}
}
});
}
setInterval(getDataFromDb, 500); // 1000 = 1 second
</script>
Date :
2014-06-20 12:24:02
By :
ไวยวิทย์
งั้นเรามาตรวจสอบ ajax บันทัดนี้ก่อนครับ ว่าได้ข้อมูลมาถูกต้องหรือไม่
13. success(function(result) {
// แทรกบันทัดนี้ครับ
alert(result); // แล้วก๊อป result ที่แสดงมาดูกันครับ
14.var obj = jQuery.parseJSON(result);
Date :
2014-06-20 12:24:48
By :
Chaidhanan
นั่นไงความเห็น 12 เลยครับ ไวยกรณ์ผิด บันทัดที่ 6,7
Date :
2014-06-20 12:29:54
By :
Chaidhanan
ขอบคุณทุกท่านมากครับ ได้แล้วครับป๋ม ตามท่าน Nico เลยครับป๋ม ขอบคุณครับ
Date :
2014-06-20 12:33:57
By :
kuzaa516
Date :
2014-06-20 12:41:24
By :
Chaidhanan
Date :
2014-06-20 13:18:12
By :
ไวยวิทย์
Load balance : Server 05