Jump to content

Archived

This topic is now archived and is closed to further replies.

RealDrift

AJAX Refresh Script

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

Share this post


Link to post
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>

Share this post


Link to post
Share on other sites

how can i use AJAx to refresh the data from the mysql database without reloading the whole frame?

 

it does what you want it to do - this is AJAX - welcome to it's world - lol. ;D

Share this post


Link to post
Share on other sites

  • put the javascipt (AJAX) code in the head of your html.
  • then add the "msgstatus" span to the area of you html body where you want the "new mail" image/status to appear.
  • change "inbox-status.php" to the url of your php page

 

 

Share this post


Link to post
Share on other sites

it's currently set to 10 seconds - because that is what you had your META Refresh set to; so that is what I set it to.

 

look for this section of the code - this is your "timer";

 

setTimeout("sendRequest()", 10000);

 

10000 = 10 Seconds

1000 = 1 Second

Share this post


Link to post
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>

Share this post


Link to post
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>

Share this post


Link to post
Share on other sites

nope doesnt work :(

 

it doesn't alert when a new message comes, when i manually refresh the frame the new message sign shows. When i read it the sign dissapears.

does this mean the script is partially working?

Share this post


Link to post
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. ???

Share this post


Link to post
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

Share this post


Link to post
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>"; 
}

?>

Share this post


Link to post
Share on other sites

the inbox variable is set, i didnt include it before:

 

$username=$_SESSION['username'];
$viewuser=$_GET['viewuser'];

$check = mysql_query("SELECT * FROM `inbox` WHERE `read`='0' AND `to`='$username'");

$inbox=mysql_num_rows($check);

 

anything wrong with that?

Share this post


Link to post
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

Share this post


Link to post
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.

Share this post


Link to post
Share on other sites

×
×
  • 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.