Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations strongm on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

AJAX to update the web page instead of refresh 2

Status
Not open for further replies.

arunrr

Programmer
Oct 2, 2009
103
US
Hello,
I have the following "messages.php" that refreshes every 15 minutes. A separate script writes to the MYDB1 database based on user input. I need an AJAX based methosd to update the web page, as opposed to the refresh below.
thanks,
Arun

<HTML>
<HEAD>
<meta http-equiv="refresh" content="15">
</HEAD>
<body onload="scrollTo(0,9999);">
<TABLE>
<?php
$con = mysql_connect("localhost","test","testpasswd");
$table = messages;
if (!$con)
{
die('Could not connect: ' . mysql_error());
}
mysql_select_db(MYDB1);
$query = "SELECT * FROM $table";
$result = mysql_query($query);

$num = mysql_num_rows($result);
mysql_close();
if ($num > 50)
{
$i = $num - 50;
}
else
{
$i = 0;
}
while ($i < $num) {
$f1 = mysql_result($result,$i,"Username");
$f2 = mysql_result($result,$i,"Time");
$f3 = mysql_result($result,$i,"Message");
?>
<TR>
<TD width="25%" align="right"><span style="font-size:11;color:#D40606;"><b><?php echo $f1; ?>
<span style="font-size:11;color:lightgrey;"> [<?php echo $f2; ?>]:</b></span></TD>
<TD width="75%" align="left"><span style="font-size:11;color:black;"><b> <?php echo $f3; ?></b></span></TD>
</TR>
<?php
$i++;
}
?>
</TABLE>
</body>
</HTML>
 
Also, with IE, i had to implement...

<body onload="scrollTo(0,1000000000);">

to get it to go to bottom. I did not have to with Chrome.

Thanks,
Arun
 
Hi

Arun said:
With IE, there seems to be an update problem.
Sorry, I have no Explorer to test with.
Arun said:
Did not do the "Day Changed to..". Have to figure out the code for that.
I have to say, it would be easier if you would store the time in a field with appropriate type : [tt]datetime[/tt] or [tt]timestamp[/tt]. Then you could extract the date and time part separately in the SQL query, something like this :
Code:
[b]select[/b]
id[teal],[/teal]username[teal],[/teal]date_format[teal]([/teal]time[teal],[/teal][green][i]'%d%b%y'[/i][/green][teal])[/teal] [b]as[/b] date[teal],[/teal]time[teal]([/teal]time[teal])[/teal] [b]as[/b] time[teal],[/teal]message
[b]from[/b] messages
[b]where[/b] id[teal]>[/teal]@last
[b]order[/b] [b]by[/b] id
Having the time stored as [tt]varchar[/tt] we will have to split it in parts either on the server ( with MySQL or PHP ) or in the browser ( with JavaScript ).

Another decision to take, is where to generate the "Day changed" message.

Personally I would
[ul]
[li]split the time in PHP[/li]
[li]generate the "Day changed" message in JavaScript[/li]
[/ul]
Code:
[teal]<?php[/teal]

[navy]$con[/navy][teal]=[/teal][COLOR=darkgoldenrod]mysql_connect[/color][teal]([/teal][green][i]'localhost'[/i][/green][teal],[/teal][green][i]'test'[/i][/green][teal],[/teal][green][i]'testpasswd'[/i][/green][teal]);[/teal]
[COLOR=darkgoldenrod]mysql_select_db[/color][teal]([/teal][green][i]'MYDB1'[/i][/green][teal]);[/teal]

[b]if[/b] [teal]([/teal][COLOR=darkgoldenrod]is_numeric[/color][teal]([/teal][navy]$_GET[/navy][teal][[/teal][green][i]'last'[/i][/green][teal]]))[/teal] [teal]{[/teal]

  [navy]$sql[/navy][teal]=[/teal][green][i]'select id,username,time,message from messages where id>'[/i][/green][teal].[/teal][COLOR=darkgoldenrod]mysql_real_escape_string[/color][teal]([/teal][navy]$_GET[/navy][teal][[/teal][green][i]'last'[/i][/green][teal]]).[/teal][green][i]' order by id'[/i][/green][teal];[/teal]
  [navy]$res[/navy][teal]=[/teal][COLOR=darkgoldenrod]mysql_query[/color][teal]([/teal][navy]$sql[/navy][teal]);[/teal]

  [navy]$message[/navy][teal]=[/teal][b]array[/b][teal]();[/teal]
  [b]while[/b] [teal]([/teal][navy]$row[/navy][teal]=[/teal][COLOR=darkgoldenrod]mysql_fetch_assoc[/color][teal]([/teal][navy]$res[/navy][teal]))[/teal] [teal]{[/teal]
    [navy]$date[/navy][teal]=[/teal][COLOR=darkgoldenrod]substr[/color][teal]([/teal][navy]$row[/navy][teal][[/teal][green][i]'time'[/i][/green][teal]],[/teal][purple]0[/purple][teal],[/teal][purple]7[/purple][teal]);[/teal]
    [navy]$time[/navy][teal]=[/teal][COLOR=darkgoldenrod]substr[/color][teal]([/teal][navy]$row[/navy][teal][[/teal][green][i]'time'[/i][/green][teal]],[/teal][purple]8[/purple][teal]);[/teal]
    [navy]$last[/navy][teal]=[/teal][navy]$row[/navy][teal][[/teal][green][i]'id'[/i][/green][teal]];[/teal]
    [navy]$message[/navy][teal][]=[/teal][b]array[/b][teal]([/teal][navy]$date[/navy][teal],[/teal][green][i]"<span>[ $time ]</span><b>$row[username]</b> $row[message]"[/i][/green][teal]);[/teal]
  [teal]}[/teal]

  [b]if[/b] [teal](![/teal][navy]$message[/navy][teal])[/teal] [teal]{[/teal]
    [COLOR=darkgoldenrod]header[/color][teal]([/teal][green][i]'Content-type: text/javascript'[/i][/green][teal]);[/teal]
    [COLOR=darkgoldenrod]header[/color][teal]([/teal][green][i]'HTTP/1.1 204 No Content'[/i][/green][teal]);[/teal]
    [b]return[/b][teal];[/teal]
  [teal]}[/teal]

  [COLOR=darkgoldenrod]header[/color][teal]([/teal][green][i]'Content-type: text/javascript'[/i][/green][teal]);[/teal]
  [b]echo[/b] [COLOR=darkgoldenrod]json_encode[/color][teal]([/teal][b]array[/b][teal]([/teal][green][i]'last'[/i][/green][teal]=>[/teal][navy]$last[/navy][teal],[/teal][green][i]'message'[/i][/green][teal]=>[/teal][navy]$message[/navy][teal]));[/teal]

  [b]return[/b][teal];[/teal]

[teal]}[/teal]

[teal]?>[/teal]
[teal]<![/teal]DOCTYPE HTML PUBLIC [green][i]"-//W3C//DTD HTML 4.01//EN"[/i][/green] [green][i]"[URL unfurl="true"]http://www.w3.org/TR/html4/strict.dtd"[/URL][/i][/green][teal]>[/teal]
[teal]<[/teal]html lang[teal]=[/teal][green][i]"en"[/i][/green][teal]>[/teal]

[teal]<[/teal]head[teal]>[/teal]
[teal]<[/teal]meta http[teal]-[/teal]equiv[teal]=[/teal][green][i]"Content-Type"[/i][/green] content[teal]=[/teal][green][i]"text/html; charset=iso-8859-1"[/i][/green][teal]>[/teal]
[teal]<[/teal]title[teal]>[/teal]BCCI Message Board[teal]</[/teal]title[teal]>[/teal]
[teal]<[/teal]style type[teal]=[/teal][green][i]"text/css"[/i][/green][teal]>[/teal]
div [teal]{[/teal]
  color[teal]:[/teal] black[teal];[/teal]
  font[teal]-[/teal]size[teal]:[/teal] xx[teal]-[/teal]small[teal];[/teal]
[teal]}[/teal]
b [teal]{[/teal]
  color[teal]:[/teal] [gray]#D40606;[/gray]
[teal]}[/teal]
span [teal]{[/teal]
  color[teal]:[/teal] lightgray[teal];[/teal]
[teal]}[/teal]
[teal]</[/teal]style[teal]>[/teal]
[teal]</[/teal]head[teal]>[/teal]

[teal]<[/teal]body onload[teal]=[/teal][green][i]"scrollTo(0,1000000000)"[/i][/green][teal]>[/teal]

[teal]<[/teal]div id[teal]=[/teal][green][i]"board"[/i][/green][teal]>[/teal]

[teal]<?php[/teal]

[navy]$sql[/navy][teal]=[/teal][green][i]'select * from (select id,username,time,message from messages order by id desc limit 50) foo order by id'[/i][/green][teal];[/teal]
[navy]$res[/navy][teal]=[/teal][COLOR=darkgoldenrod]mysql_query[/color][teal]([/teal][navy]$sql[/navy][teal]);[/teal]

[b]while[/b] [teal]([/teal][navy]$row[/navy][teal]=[/teal][COLOR=darkgoldenrod]mysql_fetch_assoc[/color][teal]([/teal][navy]$res[/navy][teal]))[/teal] [teal]{[/teal]
  [navy]$date[/navy][teal]=[/teal][COLOR=darkgoldenrod]substr[/color][teal]([/teal][navy]$row[/navy][teal][[/teal][green][i]'time'[/i][/green][teal]],[/teal][purple]0[/purple][teal],[/teal][purple]7[/purple][teal]);[/teal]
  [navy]$time[/navy][teal]=[/teal][COLOR=darkgoldenrod]substr[/color][teal]([/teal][navy]$row[/navy][teal][[/teal][green][i]'time'[/i][/green][teal]],[/teal][purple]8[/purple][teal]);[/teal]
  [b]if[/b] [teal](![/teal][navy]$last[/navy][teal])[/teal] [b]echo[/b] [green][i]"<div><span>[ The day is $date ]</span></div>\n"[/i][/green][teal];[/teal]
  [navy]$last[/navy][teal]=[/teal][navy]$row[/navy][teal][[/teal][green][i]'id'[/i][/green][teal]];[/teal]
  [b]echo[/b] [green][i]"<div><span>[ $time ]</span><b>$row[username]</b> $row[message]</div>\n"[/i][/green][teal];[/teal]
[teal]}[/teal]

[teal]?>[/teal]

[teal]</[/teal]div[teal]>[/teal]

[teal]<[/teal]div[teal]><[/teal]a name[teal]=[/teal][green][i]"end"[/i][/green][teal]></[/teal]a[teal]></[/teal]div[teal]>[/teal]

[teal]<[/teal]script type[teal]=[/teal][green][i]"text/javascript"[/i][/green][teal]>[/teal]
[b]var[/b] maxmessage[teal]=[/teal][purple]100[/purple]
[b]var[/b] last[teal]=[/teal][green][i]'<?php echo $last; ?>'[/i][/green]
[b]var[/b] date[teal]=[/teal][green][i]'<?php echo $date; ?>'[/i][/green]
[b]var[/b] board[teal]=[/teal]document[teal].[/teal][COLOR=darkgoldenrod]getElementById[/color][teal]([/teal][green][i]'board'[/i][/green][teal])[/teal]
[COLOR=darkgoldenrod]setInterval[/color][teal]([/teal]refresh[teal],[/teal][purple]1000[/purple][teal]*[/teal][purple]3[/purple][teal])[/teal]
window[teal].[/teal][COLOR=darkgoldenrod]scrollTo[/color][teal]([/teal][purple]0[/purple][teal],[/teal][purple]1000000000[/purple][teal])[/teal]

[b]function[/b] [COLOR=darkgoldenrod]refresh[/color][teal]()[/teal]
[teal]{[/teal]
  [b]var[/b] result[teal]=[/teal]undefined[teal],[/teal]obi[teal],[/teal]pos
  [b]var[/b] http[teal]=[/teal][b]new[/b] [COLOR=darkgoldenrod]XMLHttpRequest[/color][teal]()[/teal]
  http[teal].[/teal][COLOR=darkgoldenrod]open[/color][teal]([/teal][green][i]'GET'[/i][/green][teal],[/teal]document[teal].[/teal]location[teal].[/teal]pathname[teal]+[/teal][green][i]'?last='[/i][/green][teal]+[/teal]last[teal]+[/teal][green][i]'&'[/i][/green][teal]+[/teal][b]new[/b] [COLOR=darkgoldenrod]Date[/color][teal]().[/teal][COLOR=darkgoldenrod]getTime[/color][teal](),[/teal]false[teal])[/teal]
  http[teal].[/teal][COLOR=darkgoldenrod]send[/color][teal]([/teal]null[teal])[/teal]
  [b]if[/b] [teal]([/teal]http[teal].[/teal]readyState[teal]!=[/teal][purple]4[/purple] [teal]||[/teal] http[teal].[/teal]status[teal]!=[/teal][purple]200[/purple][teal])[/teal] [b]return[/b]
  [b]eval[/b][teal]([/teal][green][i]'result='[/i][/green][teal]+[/teal]http[teal].[/teal]responseText[teal])[/teal]
  [b]for[/b] [teal]([/teal][b]var[/b] i[teal]=[/teal][purple]0[/purple][teal],[/teal]l[teal]=[/teal]result[teal].[/teal]message[teal].[/teal]length[teal];[/teal]i[teal]<[/teal]l[teal];[/teal]i[teal]++)[/teal] [teal]{[/teal]
    [b]if[/b] [teal]([/teal]date[teal]!=[/teal]result[teal].[/teal]message[teal][[/teal]i[teal]][[/teal][purple]0[/purple][teal]])[/teal] [teal]{[/teal]
      date[teal]=[/teal]result[teal].[/teal]message[teal][[/teal]i[teal]][[/teal][purple]0[/purple][teal]][/teal]
      [b]var[/b] div[teal]=[/teal]document[teal].[/teal][COLOR=darkgoldenrod]createElement[/color][teal]([/teal][green][i]'div'[/i][/green][teal])[/teal]
      div[teal].[/teal]innerHTML[teal]=[/teal][green][i]'<span> [ Day changed to '[/i][/green][teal]+[/teal]date[teal]+[/teal][green][i]' ]</span>'[/i][/green]
      board[teal].[/teal][COLOR=darkgoldenrod]appendChild[/color][teal]([/teal]div[teal])[/teal]
    [teal]}[/teal]
    [b]var[/b] div[teal]=[/teal]document[teal].[/teal][COLOR=darkgoldenrod]createElement[/color][teal]([/teal][green][i]'div'[/i][/green][teal])[/teal]
    div[teal].[/teal]innerHTML[teal]=[/teal]result[teal].[/teal]message[teal][[/teal]i[teal]][[/teal][purple]1[/purple][teal]][/teal]
    board[teal].[/teal][COLOR=darkgoldenrod]appendChild[/color][teal]([/teal]div[teal])[/teal]
  [teal]}[/teal]
  [b]var[/b] [b]list[/b][teal]=[/teal]board[teal].[/teal][COLOR=darkgoldenrod]getElementsByTagName[/color][teal]([/teal][green][i]'div'[/i][/green][teal])[/teal]
  [b]for[/b] [teal]([/teal][b]var[/b] i[teal]=[/teal][b]list[/b][teal].[/teal]length[teal]-[/teal]maxmessage[teal]-[/teal][purple]1[/purple][teal];[/teal]i[teal]>=[/teal][purple]0[/purple][teal];[/teal]i[teal]--)[/teal] board[teal].[/teal][COLOR=darkgoldenrod]removeChild[/color][teal]([/teal][b]list[/b][teal][[/teal]i[teal]])[/teal]
  last[teal]=[/teal]result[teal].[/teal]last
  window[teal].[/teal][COLOR=darkgoldenrod]scrollTo[/color][teal]([/teal][purple]0[/purple][teal],[/teal][purple]1000000000[/purple][teal])[/teal]
[teal]}[/teal]
[teal]</[/teal]script[teal]>[/teal]

[teal]</[/teal]body[teal]>[/teal]

[teal]</[/teal]html[teal]>[/teal]
I hope this time I changed all field names to match your table structure. [blush]

Note that I removed this line :
Code:
[b]<link[/b] [maroon]rel[/maroon][teal]=[/teal][green][i]"stylesheet"[/i][/green] [maroon]type[/maroon][teal]=[/teal][green][i]"text/css"[/i][/green] [maroon]href[/maroon][teal]=[/teal][green][i]"/bcci.css"[/i][/green][b]>[/b]
I see no reason to include it and the /bcci.css file is syntactically wrong : it contains [tt]style[/tt] HTML tags. Such thing should not be present in a CSS file.


Feherke.
 
Hi Feherke,

All done - thanks a ton!!

Arun
 
Yes, I changed the field from VARCHAR to TIMESTAMP. Also, i had to modify the INSERT to only insert Username and Message. I was earlier inserting the Time also. Now, the TIMESTAMP field uses the default CURRENT_TIMESTAMP value.

The zeros does not matter, I can live with it. The new entries are correct.

Thanks,
Arun
 
Hi

Arun said:
I changed the field from VARCHAR to TIMESTAMP
Oops. I just mentioned it as my preferred way. I did not expected that you will actually change it. Otherwise I would have provided instructions to keep the existing messages' time.
Arun said:
The new entries are correct.
Yes, they are. But the formatting differs, the day appears beside the time, not in the date :
[ The day is 0000-00 ]
[gray](...)[/gray]
[ [highlight][red]11 [/red][/highlight]09:09:11 ]user message
The good part is that now we can remove those ugly [tt]substr()[/tt] function calls from the [tt]while[/tt] loops :
Code:
[teal]<?php[/teal]

[navy]$con[/navy][teal]=[/teal][COLOR=darkgoldenrod]mysql_connect[/color][teal]([/teal][green][i]'localhost'[/i][/green][teal],[/teal][green][i]'test'[/i][/green][teal],[/teal][green][i]'testpasswd'[/i][/green][teal]);[/teal]
[COLOR=darkgoldenrod]mysql_select_db[/color][teal]([/teal][green][i]'MYDB1'[/i][/green][teal]);[/teal]

[b]if[/b] [teal]([/teal][COLOR=darkgoldenrod]is_numeric[/color][teal]([/teal][navy]$_GET[/navy][teal][[/teal][green][i]'last'[/i][/green][teal]]))[/teal] [teal]{[/teal]

  [navy]$sql[/navy][teal]=[/teal][green][i]'select id,username,date_format(time,'[/i][/green][navy]%d%b%y[/navy][green][i]') as date,time(time) as time,message from messages where id>'[/i][/green][teal].[/teal][COLOR=darkgoldenrod]mysql_real_escape_string[/color][teal]([/teal][navy]$_GET[/navy][teal][[/teal][green][i]'last'[/i][/green][teal]]).[/teal][green][i]' order by id'[/i][/green][teal];[/teal]
  [navy]$res[/navy][teal]=[/teal][COLOR=darkgoldenrod]mysql_query[/color][teal]([/teal][navy]$sql[/navy][teal]);[/teal]

  [navy]$message[/navy][teal]=[/teal][b]array[/b][teal]();[/teal]
  [b]while[/b] [teal]([/teal][navy]$row[/navy][teal]=[/teal][COLOR=darkgoldenrod]mysql_fetch_assoc[/color][teal]([/teal][navy]$res[/navy][teal]))[/teal] [teal]{[/teal]
    [navy]$last[/navy][teal]=[/teal][navy]$row[/navy][teal][[/teal][green][i]'id'[/i][/green][teal]];[/teal]
    [navy]$message[/navy][teal][]=[/teal][b]array[/b][teal]([/teal][navy]$row[/navy][teal][[/teal][green][i]'date'[/i][/green][teal]],[/teal][green][i]"<span>[ $row[time] ]</span><b>$row[username]</b> $row[message]"[/i][/green][teal]);[/teal]
  [teal]}[/teal]

  [b]if[/b] [teal](![/teal][navy]$message[/navy][teal])[/teal] [teal]{[/teal]
    [COLOR=darkgoldenrod]header[/color][teal]([/teal][green][i]'Content-type: text/javascript'[/i][/green][teal]);[/teal]
    [COLOR=darkgoldenrod]header[/color][teal]([/teal][green][i]'HTTP/1.1 204 No Content'[/i][/green][teal]);[/teal]
    [b]return[/b][teal];[/teal]
  [teal]}[/teal]

  [COLOR=darkgoldenrod]header[/color][teal]([/teal][green][i]'Content-type: text/javascript'[/i][/green][teal]);[/teal]
  [b]echo[/b] [COLOR=darkgoldenrod]json_encode[/color][teal]([/teal][b]array[/b][teal]([/teal][green][i]'last'[/i][/green][teal]=>[/teal][navy]$last[/navy][teal],[/teal][green][i]'message'[/i][/green][teal]=>[/teal][navy]$message[/navy][teal]));[/teal]

  [b]return[/b][teal];[/teal]

[teal]}[/teal]

[teal]?>[/teal]
[teal]<![/teal]DOCTYPE HTML PUBLIC [green][i]"-//W3C//DTD HTML 4.01//EN"[/i][/green] [green][i]"[URL unfurl="true"]http://www.w3.org/TR/html4/strict.dtd"[/URL][/i][/green][teal]>[/teal]
[teal]<[/teal]html lang[teal]=[/teal][green][i]"en"[/i][/green][teal]>[/teal]

[teal]<[/teal]head[teal]>[/teal]
[teal]<[/teal]meta http[teal]-[/teal]equiv[teal]=[/teal][green][i]"Content-Type"[/i][/green] content[teal]=[/teal][green][i]"text/html; charset=iso-8859-1"[/i][/green][teal]>[/teal]
[teal]<[/teal]title[teal]>[/teal]BCCI Message Board[teal]</[/teal]title[teal]>[/teal]
[teal]<[/teal]style type[teal]=[/teal][green][i]"text/css"[/i][/green][teal]>[/teal]
div [teal]{[/teal]
  color[teal]:[/teal] black[teal];[/teal]
  font[teal]-[/teal]size[teal]:[/teal] xx[teal]-[/teal]small[teal];[/teal]
[teal]}[/teal]
b [teal]{[/teal]
  color[teal]:[/teal] [gray]#D40606;[/gray]
[teal]}[/teal]
span [teal]{[/teal]
  color[teal]:[/teal] lightgray[teal];[/teal]
[teal]}[/teal]
[teal]</[/teal]style[teal]>[/teal]
[teal]</[/teal]head[teal]>[/teal]

[teal]<[/teal]body onload[teal]=[/teal][green][i]"scrollTo(0,1000000000)"[/i][/green][teal]>[/teal]

[teal]<[/teal]div id[teal]=[/teal][green][i]"board"[/i][/green][teal]>[/teal]

[teal]<?php[/teal]

[navy]$sql[/navy][teal]=[/teal][green][i]'select * from (select id,username,date_format(time,'[/i][/green][navy]%d%b%y[/navy][green][i]') as date,time(time) as time,message from messages order by id desc limit 50) foo order by id'[/i][/green][teal];[/teal]
[navy]$res[/navy][teal]=[/teal][COLOR=darkgoldenrod]mysql_query[/color][teal]([/teal][navy]$sql[/navy][teal]);[/teal]

[b]while[/b] [teal]([/teal][navy]$row[/navy][teal]=[/teal][COLOR=darkgoldenrod]mysql_fetch_assoc[/color][teal]([/teal][navy]$res[/navy][teal]))[/teal] [teal]{[/teal]
  [b]if[/b] [teal](![/teal][navy]$last[/navy][teal])[/teal] [b]echo[/b] [green][i]"<div><span>[ The day is $row[date] ]</span></div>\n"[/i][/green][teal];[/teal]
  [navy]$last[/navy][teal]=[/teal][navy]$row[/navy][teal][[/teal][green][i]'id'[/i][/green][teal]];[/teal]
  [b]echo[/b] [green][i]"<div><span>[ $row[time] ]</span><b>$row[username]</b> $row[message]</div>\n"[/i][/green][teal];[/teal]
[teal]}[/teal]

[teal]?>[/teal]

[teal]</[/teal]div[teal]>[/teal]

[teal]<[/teal]div[teal]><[/teal]a name[teal]=[/teal][green][i]"end"[/i][/green][teal]></[/teal]a[teal]></[/teal]div[teal]>[/teal]

[teal]<[/teal]script type[teal]=[/teal][green][i]"text/javascript"[/i][/green][teal]>[/teal]
[b]var[/b] maxmessage[teal]=[/teal][purple]100[/purple]
[b]var[/b] last[teal]=[/teal][green][i]'<?php echo $last; ?>'[/i][/green]
[b]var[/b] date[teal]=[/teal][green][i]'<?php echo $date; ?>'[/i][/green]
[b]var[/b] board[teal]=[/teal]document[teal].[/teal][COLOR=darkgoldenrod]getElementById[/color][teal]([/teal][green][i]'board'[/i][/green][teal])[/teal]
[COLOR=darkgoldenrod]setInterval[/color][teal]([/teal]refresh[teal],[/teal][purple]1000[/purple][teal]*[/teal][purple]3[/purple][teal])[/teal]
window[teal].[/teal][COLOR=darkgoldenrod]scrollTo[/color][teal]([/teal][purple]0[/purple][teal],[/teal][purple]1000000000[/purple][teal])[/teal]

[b]function[/b] [COLOR=darkgoldenrod]refresh[/color][teal]()[/teal]
[teal]{[/teal]
  [b]var[/b] result[teal]=[/teal]undefined[teal],[/teal]obi[teal],[/teal]pos
  [b]var[/b] http[teal]=[/teal][b]new[/b] [COLOR=darkgoldenrod]XMLHttpRequest[/color][teal]()[/teal]
  http[teal].[/teal][COLOR=darkgoldenrod]open[/color][teal]([/teal][green][i]'GET'[/i][/green][teal],[/teal]document[teal].[/teal]location[teal].[/teal]pathname[teal]+[/teal][green][i]'?last='[/i][/green][teal]+[/teal]last[teal]+[/teal][green][i]'&'[/i][/green][teal]+[/teal][b]new[/b] [COLOR=darkgoldenrod]Date[/color][teal]().[/teal][COLOR=darkgoldenrod]getTime[/color][teal](),[/teal]false[teal])[/teal]
  http[teal].[/teal][COLOR=darkgoldenrod]send[/color][teal]([/teal]null[teal])[/teal]
  [b]if[/b] [teal]([/teal]http[teal].[/teal]readyState[teal]!=[/teal][purple]4[/purple] [teal]||[/teal] http[teal].[/teal]status[teal]!=[/teal][purple]200[/purple][teal])[/teal] [b]return[/b]
  [b]eval[/b][teal]([/teal][green][i]'result='[/i][/green][teal]+[/teal]http[teal].[/teal]responseText[teal])[/teal]
  [b]for[/b] [teal]([/teal][b]var[/b] i[teal]=[/teal][purple]0[/purple][teal],[/teal]l[teal]=[/teal]result[teal].[/teal]message[teal].[/teal]length[teal];[/teal]i[teal]<[/teal]l[teal];[/teal]i[teal]++)[/teal] [teal]{[/teal]
    [b]if[/b] [teal]([/teal]date[teal]!=[/teal]result[teal].[/teal]message[teal][[/teal]i[teal]][[/teal][purple]0[/purple][teal]])[/teal] [teal]{[/teal]
      date[teal]=[/teal]result[teal].[/teal]message[teal][[/teal]i[teal]][[/teal][purple]0[/purple][teal]][/teal]
      [b]var[/b] div[teal]=[/teal]document[teal].[/teal][COLOR=darkgoldenrod]createElement[/color][teal]([/teal][green][i]'div'[/i][/green][teal])[/teal]
      div[teal].[/teal]innerHTML[teal]=[/teal][green][i]'<span> [ Day changed to '[/i][/green][teal]+[/teal]date[teal]+[/teal][green][i]' ]</span>'[/i][/green]
      board[teal].[/teal][COLOR=darkgoldenrod]appendChild[/color][teal]([/teal]div[teal])[/teal]
    [teal]}[/teal]
    [b]var[/b] div[teal]=[/teal]document[teal].[/teal][COLOR=darkgoldenrod]createElement[/color][teal]([/teal][green][i]'div'[/i][/green][teal])[/teal]
    div[teal].[/teal]innerHTML[teal]=[/teal]result[teal].[/teal]message[teal][[/teal]i[teal]][[/teal][purple]1[/purple][teal]][/teal]
    board[teal].[/teal][COLOR=darkgoldenrod]appendChild[/color][teal]([/teal]div[teal])[/teal]
  [teal]}[/teal]
  [b]var[/b] [b]list[/b][teal]=[/teal]board[teal].[/teal][COLOR=darkgoldenrod]getElementsByTagName[/color][teal]([/teal][green][i]'div'[/i][/green][teal])[/teal]
  [b]for[/b] [teal]([/teal][b]var[/b] i[teal]=[/teal][b]list[/b][teal].[/teal]length[teal]-[/teal]maxmessage[teal]-[/teal][purple]1[/purple][teal];[/teal]i[teal]>=[/teal][purple]0[/purple][teal];[/teal]i[teal]--)[/teal] board[teal].[/teal][COLOR=darkgoldenrod]removeChild[/color][teal]([/teal][b]list[/b][teal][[/teal]i[teal]])[/teal]
  last[teal]=[/teal]result[teal].[/teal]last
  window[teal].[/teal][COLOR=darkgoldenrod]scrollTo[/color][teal]([/teal][purple]0[/purple][teal],[/teal][purple]1000000000[/purple][teal])[/teal]
[teal]}[/teal]
[teal]</[/teal]script[teal]>[/teal]

[teal]</[/teal]body[teal]>[/teal]

[teal]</[/teal]html[teal]>[/teal]

Feherke.
 
Hi,

I get the following error with the latest php...

Parse error: syntax error, unexpected T_CONSTANT_ENCAPSED_STRING in /home1/bccicom/public_html/messages.php on line 8

Thanks,
Arun
 
Hi

Ouch. Sorry. That code was partially copy-pasted and I missed that part. In line 8 the first piece of string now contains single quotes ( ' ) so it has to be enclosed in double quotes ( " ) :
Code:
[navy]$sql[/navy][teal]=[/teal][green][i][highlight]"[/highlight]select id,username,date_format(time,'%d%b%y') as date,time(time) as time,message from messages where id>[highlight]"[/highlight][/i][/green][teal].[/teal][COLOR=darkgoldenrod]mysql_real_escape_string[/color][teal]([/teal][navy]$_GET[/navy][teal][[/teal][green][i]'last'[/i][/green][teal]]).[/teal][green][i]' order by id'[/i][/green][teal];[/teal]
Beside that, I found a small error : if those first 50 messages sent out with the page itself are from different days, intermediate new day messages are not generated.
Code:
[b]while[/b] [teal]([/teal][navy]$row[/navy][teal]=[/teal][COLOR=darkgoldenrod]mysql_fetch_assoc[/color][teal]([/teal][navy]$res[/navy][teal]))[/teal] [teal]{[/teal]
  [highlight][b]if[/b] [teal]([/teal][navy]$date[/navy][teal]!=[/teal][navy]$row[/navy][teal][[/teal][green][i]'date'[/i][/green][teal]])[/teal] [teal]{[/teal][/highlight]
    [highlight][navy]$date[/navy][teal]=[/teal][navy]$row[/navy][teal][[/teal][green][i]'date'[/i][/green][teal]];[/teal][/highlight]
    [highlight][b]echo[/b] [green][i]"<div><span>[ Day changed to $date ]</span></div>\n"[/i][/green][teal];[/teal][/highlight]
  [highlight][teal]}[/teal][/highlight]
  [navy]$last[/navy][teal]=[/teal][navy]$row[/navy][teal][[/teal][green][i]'id'[/i][/green][teal]];[/teal]
  [b]echo[/b] [green][i]"<div><span>[ $row[time] ]</span><b>$row[username]</b> $row[message]</div>\n"[/i][/green][teal];[/teal]
[teal]}[/teal]
And one more thing. My code was written based on standards. So it not works in Explorer 5.5 and 6. Including the following, will work in those too :
Code:
[b]if[/b] [teal]([/teal][b]typeof[/b] XMLHttpRequest[teal]==[/teal][green][i]'undefined'[/i][/green][teal])[/teal] [teal]{[/teal]
  XMLHttpRequest[teal]=[/teal][b]function[/b][teal]()[/teal] [teal]{[/teal]
    [b]try[/b] [teal]{[/teal] [b]return[/b] [b]new[/b] [COLOR=darkgoldenrod]ActiveXObject[/color][teal]([/teal][green][i]'Msxml2.XMLHTTP.6.0'[/i][/green][teal])[/teal] [teal]}[/teal] [b]catch[/b] [teal]([/teal]e[teal])[/teal] [teal]{[/teal] [teal]}[/teal]
    [b]try[/b] [teal]{[/teal] [b]return[/b] [b]new[/b] [COLOR=darkgoldenrod]ActiveXObject[/color][teal]([/teal][green][i]'Msxml2.XMLHTTP.3.0'[/i][/green][teal])[/teal] [teal]}[/teal] [b]catch[/b] [teal]([/teal]e[teal])[/teal] [teal]{[/teal] [teal]}[/teal]
    [b]try[/b] [teal]{[/teal] [b]return[/b] [b]new[/b] [COLOR=darkgoldenrod]ActiveXObject[/color][teal]([/teal][green][i]'Msxml2.XMLHTTP'[/i][/green][teal])[/teal] [teal]}[/teal] [b]catch[/b] [teal]([/teal]e[teal])[/teal] [teal]{[/teal] [teal]}[/teal]
    [b]try[/b] [teal]{[/teal] [b]return[/b] [b]new[/b] [COLOR=darkgoldenrod]ActiveXObject[/color][teal]([/teal][green][i]'Microsoft.XMLHTTP'[/i][/green][teal])[/teal] [teal]}[/teal] [b]catch[/b] [teal]([/teal]e[teal])[/teal] [teal]{[/teal] [teal]}[/teal]
  [teal]}[/teal]
[teal]}[/teal]
( However, I would prefer to include a link to RIP IE6 instead... )

By the way, you know that now you could easily display the date in a less condensed format ? Personally I would prefer "Monday, 12 April 2010" instead of "12Apr10". You only have to change the [tt]date_format()[/tt] function's second parameter in the SQL [tt]select[/tt]s. For example to '%W, %d %M %Y' to obtain the earlier mentioned format. See [tt]date_format()[/tt] in the MySQL documentation for more format specifiers.


Feherke.
 
Hi Feherke,

Implemented. Looks to be working fine.

Thanks a million,
Arun
 
Hi Feherke,

Sorry to drag this thread out for so long...

I have one question...

Seems that periodically (every few seconds) there is a pause ( delay in response). It happens about every 3 seconds and i am wondering if the refresh interval in the script has anything to do with this.

Instead of the refresh periodically, can the update happen every time a new chat message is submitted?

Thanks,
Arun
 
Hi

Arun said:
Seems that periodically (every few seconds) there is a pause ( delay in response). It happens about every 3 seconds and i am wondering if the refresh interval in the script has anything to do with this.
Well, the interval to call the refresh() function is set to 3 seconds :
the script said:
[tt]setInterval[teal]([/teal]refresh[teal],[/teal][purple]1000[/purple][teal]*[/teal][purple][highlight]3[/highlight][/purple][teal])[/teal][/tt]
You can decrement it if you want, but I would not do it. Or if you do, keep an eye on the server's processor load.
Arun said:
Instead of the refresh periodically, can the update happen every time a new chat message is submitted?
With the HTTP protocol the server can not connect to the client. So the chat solutions like your ( both the current one and the original ) are using client pull. There are trick to write server push chats over HTTP protocol, but it is not trivial and will not work in certain conditions. So server push chats usually still have client pull implemented for fallback. Until now, the only reliable server push chats I saw were commercial.

To circumvent the HTTP protocol's limitation, Java applet or Flash can be used. They are able to open raw TCP connection.


Feherke.
 
Hi Feherke,

OK, understand your explanation with the client pull vs server push.

Isn't is possible to do the 'client pull' when the user clicks on the submit button after typing the message? In this case I may need to combine the postmsg.php and the messages.php

Thanks,
Arun
 
Hi

Arun said:
Isn't is possible to do the 'client pull' when the user clicks on the submit button after typing the message? In this case I may need to combine the postmsg.php and the messages.php
That could solve it in case of that user who submitted the message. But not for the others. Is that what you want ?


Feherke.
 
Ah, i see. You are right. No that is not what I want. We will just leave it as is.

This has been a great education. Your tips are truly appreciated.

Thanks again,
Arun
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top