|
 |
| |
มีปัญหาการประยุกต์ใช้ Ajax (realtime) + php (ระบบ Chat) มีตัวอย่างให้ดูครับ |
| |
 |
|
|
 |
 |
|
Code ที่นำมาประยุกต์ใช้
https://www.thaicreate.com/community/ajax-display-data-real-time.html
สวนเพิ่มเติ่มคือ window.scrollBy(0,10000);
คำอธิบายคือ ต้องการให้สกอบาร์อยู่ล่างเสมอเมื่อมีข้อมูลให้ก็จะเเสดงอยู่ด้านล่าง ดังภาพ
การแสดงทำงานปกติ
ผมใช้หลักการแบบนี้ หน้าหลัก ใช้ iframe
หน้าที่ AjaxPHPRealtime_chat0.php
Code (PHP)
<div style="height: 400px;">
<iframe id="chat" src="AjaxPHPRealtime_chat1.php" frameborder="0" marginwidth="0" marginheight="0" width="424px"
height="400px" style="padding: 0; margin: 0; border: 0;"></iframe>
<br>
<iframe src="ilm_box_chat.php?id_user=2&&id_friend=3" height="100" width="424" scrolling="no" frameborder="0" ></iframe>
</div>
หน้า AjaxPHPRealtime_chat0.php เรียก AjaxPHPRealtime_chat1.php
AjaxPHPRealtime_chat1.php
Code (PHP)
<script language="JavaScript">
function bodyOnload()
{
doCallAjax('CustomerID')
setTimeout("doLoop();",2000);
}
function doLoop()
{
bodyOnload();
}
</script>
<script language="JavaScript">
var HttPRequest = false;
function doCallAjax(Sort) {
HttPRequest = false;
if (window.XMLHttpRequest) { // Mozilla, Safari,...
HttPRequest = new XMLHttpRequest();
if (HttPRequest.overrideMimeType) {
HttPRequest.overrideMimeType('text/html');
}
} else if (window.ActiveXObject) { // IE
try {
HttPRequest = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
HttPRequest = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e) {}
}
}
if (!HttPRequest) {
alert('Cannot create XMLHTTP instance');
return false;
}
var url = 'AjaxPHPRealtime_chat3.php';
var pmeters = 'mySort='+Sort;
HttPRequest.open('POST',url,true);
HttPRequest.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
HttPRequest.setRequestHeader("Content-length", pmeters.length);
HttPRequest.setRequestHeader("Connection", "close");
HttPRequest.send(pmeters);
HttPRequest.onreadystatechange = function()
{
if(HttPRequest.readyState == 3) // Loading Request
{
document.getElementById("mySpan").innerHTML = "Now is Loading...";
}
if(HttPRequest.readyState == 4) // Return Request
{
document.getElementById("mySpan").innerHTML = HttPRequest.responseText;
// document.getElementById('chat').contentWindow.window.scrollBy(0,1000);
window.scrollBy(0,10000);
}
}
}
</script>
<body Onload="bodyOnload();">
<form name="frmMain" action="" method="post">
<script language="JavaScript">
function bodyOnload()
{
doCallAjax('CustomerID')
setTimeout("doLoop();",3000);
}
function doLoop()
{
bodyOnload();
}
</script>
<span id="mySpan"></span>
หน้า AjaxPHPRealtime_chat1.php เรียก AjaxPHPRealtime_chat3.php
หน้า AjaxPHPRealtime_chat3.php สวนแสดงผล
Code (PHP)
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<?php
include('connect_new.php');
$strSort = $_POST["mySort"];
?>
<table width="400" border="0" cellspacing="0" cellpadding="0" >
<tr>
<td valign="bottom">
<? $m_id=2;
$user=3;
$sqlz = " select * from tb_chat where ch_sender = $m_id OR ch_recipients = $m_id OR ch_sender = $user OR ch_recipients = $user ";
$queryz = mysql_query($sqlz);
while($dbz= mysql_fetch_array($queryz))
{
$sql = "select * from tb_member where m_id='$dbz[ch_sender]' ";
$query = mysql_db_query($dbname,$sql);
$db = mysql_fetch_array($query);
?>
<table width="400" border="0" cellspacing="0" cellpadding="0">
<tr>
<td ><a href="last"><img src="<? echo $db[m_image]; ?>" width="50" height="50"/></a><? echo $dbz[ch_detail]?></td>
</tr>
</table>
<? } ?>
</td>
</tr>
</table>
ปัญหาที่ต้องการให้ช่วยคือ
ตอนนี้ เพจจะเรียกทุกๆ 3 วิ ทำให้ สกอบาร์ เวลาเราอ่านย้อนหลัง มันจะทำให้ดีดลงมา auto
จะขอเช็คค่าก่อนว่า ฐานข้อมูลมีค่าใหม่รึป่าว ถ้ามีถึงให้ ajax ตัวนี้ทำงาน ได้ไหมครับ หรือควรทำยังไง
การเรียกหน้าซ้อนๆกันแบบนี้ ผิดไหม หรือมีคำแนะนำอื่นๆสามารถแนะนำได้เลยนะครับ
ขอบคุณครับ
Tag : PHP, MySQL, Ajax
|
|
|
 |
 |
 |
 |
| Date :
2012-02-08 11:02:37 |
By :
skmbz |
View :
6742 |
Reply :
15 |
|
 |
 |
 |
 |
|
|
|
|
 |
 |
|
 |
 |
| |
|
|
|
| |
|
ลองเช็ค mouseover ดูครับ ถ้าหน้าต่างแชทมี mouseover ก็หยุดรีเฟรช mouseout ก็เริ่มนับรีเฟรช
|
| |
|
|
| |
| Date :
2012-02-08 11:09:45 |
By :
011 |
|
|
| |
|
|
|
|
|
| |
|
|
|
| |
|
|
|
| |
|
ยังไม่ get ฮัฟ มันเป็นหน้า chat นะครับ ไม่ไช่ tab chat
|
| |
|
|
| |
| Date :
2012-02-08 12:07:00 |
By :
skmbz |
|
|
| |
|
|
|
|
|
| |
|
|
|
| |
|
|
|
| |
|
ครับ หน้าแชทครับ เราเลื่อนสกอบาร์ขึ้นไป มันชอบรีเฟรช เลยต้องเช็ค mouseover ครับ
ลองดูครับ
Code (PHP)
<script language="JavaScript">
var refresh = '';
function bodyOnload()
{
doCallAjax('CustomerID')
refresh = setTimeout("doLoop();",3000);
}
function doLoop()
{
bodyOnload();
}
function stopRefresh()
{
clearTimeout(refresh);
}
</script>
ที่ mysapn เป็น <span id="myspan" onmouseover="stopRefresh()" onmouseout="doLoop()"></span>
|
| |
|
|
| |
| Date :
2012-02-08 12:22:49 |
By :
011 |
|
|
| |
|
|
|
|
|
| |
|
|
|
| |
|
|
|
| |
|
รอบนี้ไม่โชว์อะไรเลยครับ
|
| |
|
|
| |
| Date :
2012-02-08 13:36:43 |
By :
skmbz |
|
|
| |
|
|
|
|
|
| |
|
|
|
| |
|
|
|
| |
|
ได้แล้วครับ ขอบคุณมากๆเลย
http://ilike-plus.com/AjaxPHPRealtime_Chat0.php ลองดูนะครับ
|
| |
|
|
| |
| Date :
2012-02-08 13:46:38 |
By :
skmbz |
|
|
| |
|
|
|
|
|
| |
|
|
|
| |
|
|
|
| |
|
ตกลงแก้ไงครับ 
|
| |
|
|
| |
| Date :
2012-02-08 13:49:39 |
By :
webmaster |
|
|
| |
|
|
|
|
|
| |
|
|
|
| |
|
|
|
| |
|
แก้ไขหน้า AjaxPHPRealtime_chat1.php
เปลี่ยน Script มาใช้
Code (PHP)
<script language="JavaScript">
var refresh = '';
function bodyOnload()
{
doCallAjax('CustomerID')
refresh = setTimeout("doLoop();",3000);
}
function doLoop()
{
bodyOnload();
}
function stopRefresh()
{
clearTimeout(refresh);
}
</script>
<span id="mySpan" onmouseover="stopRefresh()" onmouseout="doLoop()"></span>
ตอนแรกที่บอกไม่ได้ก็เพราะพิพม์ผิด ตรง myspan ต้องเป็น mySpan ครับ
<span id="myspan" onmouseover="stopRefresh()" onmouseout="doLoop()"></span>
Full code หน้าดึงข้อมูล AjaxPHPRealtime_Chat1 นำไปศึกษาต่อได้เลย
Code (PHP)
<script language="JavaScript">
var HttPRequest = false;
function doCallAjax(Sort) {
HttPRequest = false;
if (window.XMLHttpRequest) { // Mozilla, Safari,...
HttPRequest = new XMLHttpRequest();
if (HttPRequest.overrideMimeType) {
HttPRequest.overrideMimeType('text/html');
}
} else if (window.ActiveXObject) { // IE
try {
HttPRequest = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
HttPRequest = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e) {}
}
}
if (!HttPRequest) {
alert('Cannot create XMLHTTP instance');
return false;
}
var url = 'AjaxPHPRealtime_Chat3.php';
var pmeters = 'mySort='+Sort;
HttPRequest.open('POST',url,true);
HttPRequest.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
HttPRequest.setRequestHeader("Content-length", pmeters.length);
HttPRequest.setRequestHeader("Connection", "close");
HttPRequest.send(pmeters);
HttPRequest.onreadystatechange = function()
{
if(HttPRequest.readyState == 3) // Loading Request
{
document.getElementById("mySpan").innerHTML = "Now is Loading...";
}
if(HttPRequest.readyState == 4) // Return Request
{
document.getElementById("mySpan").innerHTML = HttPRequest.responseText;
window.scrollBy(0,10000);
}
}
}
</script>
<body Onload="bodyOnload();">
<form name="frmMain" action="" method="post">
<script language="JavaScript">
var refresh = '';
function bodyOnload()
{
doCallAjax('ch_id')
refresh = setTimeout("doLoop();",3000);
}
function doLoop()
{
bodyOnload();
}
function stopRefresh()
{
clearTimeout(refresh);
}
</script>
<span id="mySpan" onmouseover="stopRefresh()" onmouseout="doLoop()"></span>
ขอบคุณพี่ๆ มากครับ ที่ช่วยเหลือ
|
| |
|
|
| |
| Date :
2012-02-08 14:37:19 |
By :
skmbz |
|
|
| |
|
|
|
|
|
| |
|
|
|
| |
|
|
|
| |
|
พี่ครับผมอยากนำสคริปของพี่มาใช้เชื่อมกับ user ของเว็บผมแต่อยากให้คุยแบบส่วนตัวด้วยอ่ะครับต้องทำไงหรอครับ
|
| |
|
|
| |
| Date :
2012-02-08 20:08:16 |
By :
maruey00 |
|
|
| |
|
|
|
|
|
| |
|
|
|
| |
|
|
|
| |
|
เอามาแชร์บ้างสิ อยากได้เหมือนกัน อ่ะ
|
| |
|
|
| |
| Date :
2012-04-25 10:33:04 |
By :
BB |
|
|
| |
|
|
|
|
|
| |
|
|
|
| |
|
|
|
| |
|
ขอตัวอย่างนำไปประยุกต์ใช้งานบ้างครับ
[email protected]
|
| |
|
|
| |
| Date :
2013-10-10 13:58:01 |
By :
chamchantr |
|
|
| |
|
|
|
|
|
| |
|
|
|
| |
|
|
|
| |
|
แชร์มั่งสิครับ อยากได้ไปใช้งานเหมือนกัน
|
| |
|
|
| |
| Date :
2013-10-10 16:30:27 |
By :
mzDeaThly |
|
|
| |
|
|
|
|
|
| |
|
|
|
| |
|
|
|
| |
|
ไม่น่าใช้ iframe นะครับ ควรใช้เป็น Div มากกว่า iframe ผมไว้ใช้อัพโหลดไฟล์เท่านั้น
ลองดูอันนี้ผมทำไว้ขำขำเท่านั้น
http://kogun.winner.co.th/mobile/mobile/memberchat.php
|
| |
|
|
| |
| Date :
2013-10-10 16:44:25 |
By :
zoceferatu |
|
|
| |
|
|
|
|
|
| |
|
|
|
| |
|
|
|
| |
|
กระทู้ตั้งเมื่อ เดือน ก.พ. 2555 ผ่านมาก็เกือบจะ 2 ปีแล้วครับ....แค่อยากบอกเฉย ๆ
|
| |
|
|
| |
| Date :
2013-10-10 17:39:10 |
By :
apisitp |
|
|
| |
|
|
|
|
|
| |
|
|
|
| |
|
|
|
| |
|
Code (JavaScript)
<script type="text/javascript">
var refresh = '';
$(function(){
setInterval(function(){
var getData=$.ajax({
cache: false,
type: 'POST',
url:"chatcon.php",
// data:"rev=1",
async:false,
data: {"id":"<?=$id?>"},
success:function(getData){
$("div#showData").html(getData);
}
}).responseText;
},2000);
</script>
ถ้าเป็น script ตัวนี้ จะใส่ยังไงดีครับช่วยหน่อยครับ
|
| |
|
|
| |
| Date :
2017-09-20 22:48:19 |
By :
mayaking |
|
|
| |
|
|
|
|
|
| |
|
|
|
|
|
| |
|
 Load balance : Server 02
|
