A-AA+then

ใช้ Ajax แบบ Reatl time โดยมีการ Search และ Paging ช่วยทีครับ

1,587
<script language="JavaScript">
       var HttPRequest = false;

       function doCallAjax(Search,Page) {
          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 = 'supervi_search';
            var pmeters = 'mySearch='+Search;
            var pmeters = "mySearch="+Search+"&myPage="+Page;
            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;
                  }
               
            }

       }
</script>



<body Onload="bodyOnload('');">
<form name="frmMain" action="" method="POST">
<script language="JavaScript">
function bodyOnload()
{
    doCallAjax('','')
    setTimeout("doLoop();",3000);
}

function doLoop()
{
    bodyOnload();
}
    </script>

<table width="850" border="0" align="center">
<tr>
    <td bgcolor="#009E8E">
    <p><strong>รหัสรายงาน</strong>:
      <input type="text" name="txtSearch" id="txtSearch" >
      <input type="button" name="btnSearch" id="btnSearch" value="ค้นหา" OnClick=            "doCallAjax(document.getElementById('txtSearch').value,'1');">
    </p>
    </td>
</tr>
</table>
<div align="center"><span id="mySpan"></span></div>


*ตัวโปรแกรม มีการ Search และ Paging ได้  แต่เมื่อเรากดดูที่หน้า ต่อไป แล้วพอถึงเวลา Loop  มันจะกลับไปที่ หน้า 1 ใหม่  ทำยังไงให้มันยังอยู่ที่หน้าเดิมที่เปิดอยู่ครับ

3 ความคิดเห็น

เมื่อมีการกด page ต่อไป ให้เก็บค่า page ไว้ด้วยครับ โดยต้องส่งค่านี้ไปเสมอ เพื่อให้สามารถระบุได้ว่าขณะนี้อยู่หน้าไหน

ถ้าไม่ส่งไป ก็จะแสดงหน้าแรกเสมอ

ทางออกก้อาจเก็บค่า page ไว้ที่ session ก้ได้ หรืออาจจะ สร้าง hidden field เพื่อมาเก็บค่า page ที่กำลังแสดงอยู่ไว้

1.ถ้ามีการคลิก page โดย user ให้อัปเดท ฟิลด์นี้

2.autorefresh ให้อ่าน field นี้ส่งไปด้วยเสมอ



1

ข้อตัวอย่างได้มั้ยครับ  เพราะผมเพิ่งเริ่มใช้ Ajax
2

3
^