Jump to content

AJAX Refresh Script


RealDrift

Recommended Posts

Hi,

 

currently i have the following php code:

 

 <?php 
			  if ($inbox > 0){ echo "<a href=inbox.php target=middle><img border=0 src=images/unread1.gif align=left  width=16 height=11></a> "; 
			  }else{ echo "<img src=images/read.gif align=left width=16 height=11>"; } 
		      
			   if ($inbox > 0){ echo "<span  style=FONT-WEIGHT:bold><a href=inbox.php 
target=middle><font color=#990066>$inbox New </a></font></span>"; } ?>

 

all it does it display whether user has new message in inbox or not. however currently i am using <META http-equiv="refresh" content="10"> to refresh the whole frame. how can i use AJAx to refresh the data from the mysql database without reloading the whole frame?

 

thanks

Link to comment
Share on other sites

try this:

 

<script language="javascript">
function createRequestObject() {

   var req;

   if(window.XMLHttpRequest){
      // Firefox, Safari, Opera...
      req = new XMLHttpRequest();
   } else if(window.ActiveXObject) {
      // Internet Explorer 5+
      req = new ActiveXObject("Microsoft.XMLHTTP");
   } else {
      // There is an error creating the object,
      // just as an old browser is being used.
     alert("Your Browser Does Not Support This Script - Please Upgrade Your Browser ASAP");
   }

   return req;

}

// Make the XMLHttpRequest object
var http = createRequestObject();

function sendRequest(page) {

   // Open PHP script for requests
   http.open('get', page);
   http.onreadystatechange = handleResponse;
   http.send(null);
   setTimeout("sendRequest()", 10000);

}

function handleResponse() {

   if(http.readyState == 4 && http.status == 200){

      // Text returned FROM the PHP script
      var response = http.responseText;

      if(response) {
         // UPDATE ajaxTest content
         document.getElementById("msgstatus").innerHTML = response;
      }

   }

}

window.onload=function() {
sendRequest('inbox-status.php'); // replace "inbox-status.php" with your php page's url
}
</script>

</head><body>

<span id="msgstatus"></span>

Link to comment
Share on other sites

it doesnt seem to work, perhaps you can look at the code and tell me why:

 

<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<link rel=stylesheet href=includes/in.css type=text/css>
<style type="text/css">
<!--
.style2 {font-size: 12}
.style3 {font-size: 11px}
-->
</style>

<html>

<script language="javascript">
function createRequestObject() {

   var req;

   if(window.XMLHttpRequest){
      // Firefox, Safari, Opera...
      req = new XMLHttpRequest();
   } else if(window.ActiveXObject) {
      // Internet Explorer 5+
      req = new ActiveXObject("Microsoft.XMLHTTP");
   } else {
      // There is an error creating the object,
      // just as an old browser is being used.
     alert("Your Browser Does Not Support This Script - Please Upgrade Your Browser ASAP");
   }

   return req;

}

// Make the XMLHttpRequest object
var http = createRequestObject();

function sendRequest(page) {

   // Open PHP script for requests
   http.open('get', page);
   http.onreadystatechange = handleResponse;
   http.send(null);
   setTimeout("sendRequest()", 1000);

}

function handleResponse() {

   if(http.readyState == 4 && http.status == 200){

      // Text returned FROM the PHP script
      var response = http.responseText;

      if(response) {
         // UPDATE ajaxTest content
         document.getElementById("msgstatus").innerHTML = response;
      }

   }

}

window.onload=function() {
sendRequest('message.php'); // replace "inbox-status.php" with your php page's url
}
</script>

</head>

<body>

<TABLE

			width="110%" height="10" border="0" cellPadding="0" cellSpacing="0" bordercolor="#737373" class="thinline" id="Table1" style="LEFT: 0px; POSITION: absolute; TOP: 0px; height: 100%;" name="Table1">

			<TR valign="middle">

			  <TD width="4%" align="left" valign="middle"><span id="msgstatus" class="style2">
		      <?php 
			  if ($inbox > 0){ echo "<a href=inbox.php target=middle><img border=0 src=images/unread1.gif align=left  width=16 height=11></a> "; 
			  }else{ echo "<img src=images/read.gif align=left width=16 height=11>"; } 
		      
			   if ($inbox > 0){ echo "<span  style=FONT-WEIGHT:bold><a href=inbox.php 



ONMOUSEOUT=\"javascript:document.location.reload();\"



target=middle><font color=#990066>$inbox New </a></font></span>"; } ?>
			  </span></TD>

			  <td width="96%" bgcolor="#737373"></td>
		    </TR>
</TABLE>

</body>

</html>

Link to comment
Share on other sites

try this - I did not test the first code I gave you - the code below will automatically update.

 

<script language="javascript">
function createRequestObject() {

   var req;

   if(window.XMLHttpRequest){
      // Firefox, Safari, Opera...
      req = new XMLHttpRequest();
   } else if(window.ActiveXObject) {
      // Internet Explorer 5+
      req = new ActiveXObject("Microsoft.XMLHTTP");
   } else {
      // There is an error creating the object,
      // just as an old browser is being used.
     alert("Your Browser Does Not Support This Script - Please Upgrade Your Browser ASAP");
   }

   return req;

}

// Make the XMLHttpRequest object
var http = createRequestObject();

function sendRequest(page) {

   // Open PHP script for requests
   http.open('get', page);
   http.onreadystatechange = handleResponse;
   http.send(null);

}

function handleResponse() {

   if(http.readyState == 4 && http.status == 200){

      // Text returned FROM the PHP script
      var response = http.responseText;

      if(response) {
         // UPDATE ajaxTest content
         document.getElementById("msgstatus").innerHTML = response;
      }

   }

}

function repeatloop()
{
sendRequest('inbox-status.php.php'); // replace "inbox-status.php" with your php page's url
setTimeout("repeatloop()", 10000);
}

window.onload=function() {
repeatloop();
}
</script>

</head><body>

<span id="msgstatus"></span>

Link to comment
Share on other sites

no - the AJAX script works perfectly - I tested it; must be your php code.

 

you can test it by creating a php script called "inbox-status.php" and in that php page; add this script and save it:

 

<?php

echo "Hello World!";

?>

 

then look at the page your AJAX script is in and you will see "Hello World!"

 

wait a few second; then update and save your php file to this:

 

<?php

echo "Goodbye World!";

?>

 

then look at the page your AJAX script is in and you will see "Goodbye World!" (do not reload the page - it will automatically appear in 10 seconds or less)

 

the PHP page your using to query your database will automatically update the PHP files content; but the above is a simulation, so you can actually see that it works.

 

test it out - it works perfectly for me. ???

Link to comment
Share on other sites

yes it is my php which is wrong, hmmm

 

<TD width="4%" align="left" valign="middle"><span id="msgstatus"><span class="style2">
		      <?php 
			  if ($inbox > 0){ 
			  echo "<a href=inbox.php target=middle><img border=0 src=images/unread1.gif 		                         align=left  width=16 height=11></a> "; 
			  }else{ 
			  echo "<img src=images/read.gif align=left width=16 height=11>"; } 
		      
			   ?>
			  </span></span></TD>

 

whats wrong with the above code then? i can't figure it out

Link to comment
Share on other sites

you need to set you "$inbox" variable to check the database field where your store them for mysql_num_rows.

 

something like:

 

<?php

$query = mysql_query("SELECT inboxField FROM tblName");
$inbox = mysql_num_rows($query);

if ($inbox != 0)
{
echo "<a href=\"inbox.php\" target=\"middle\"><img border=0 src=\"images/unread1.gif\">"; 	
}
else {
echo "<img src=\"images/read.gif\" align=left width=16 height=11>"; 
}

?>

Link to comment
Share on other sites

are you sure this script works with php and mysql databases?

 

positive guy - I just tested it (I run PHP on my website) - you need to work on your php script

 

the php forum on this site can help you further with your php script:

 

http://www.phpfreaks.com/forums/index.php/board,1.0.html

 

the ajax script I provided you work awesomely  :D

Link to comment
Share on other sites

Didn't think it worthy of a new thread so I'll ask here. Would it be possible to do this refresh with a dynamic image? Because if it inserts it straight into the page, it comes up as gobbledy gook characters and symbols because of the raw image.. How would this be doable?

 

Sam

 

I am not that great with dynamic images; you might want to ask that question on the PHP forum. I suggest "MadTechie"; he is really good with dynamic image creation and manipulation.

Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.