views:

976

answers:

3

Further to my question yesterday (here), I am working on a webpage that has a section that shows 'live' order details.

The top half of my webpage has Spry Tabbed Panels. One of the panels contains an include call to a separate php page that I have created (getOpenOrders.php). This contains an SQL query to obtain all open orders and then puts the details into a table.

As a result, the table of open orders is shown in the Spry panel. What steps do I now need to take to have this refresh every 15 seconds?

+1  A: 

Do you really want to call the database every 15 seconds for each user? isn't that an overload?

I'm not saying that your database will be overloaded, but, thats how you shouldn't do things!

Edited

you should show an image, or the link to that page in order to gt an appropriate answer, because it all depends in what are you doing in the table.

because I don't know, I will give you an answer on what probably is happening.

Because you said that you're new to the ajax world, let's make things simple, and not to complicate on the you should return a JSON object and use it to re populate your table. :)

So we will start with 2 buttons (Previous and Next) so the user can move the data that is showing (you probably don't want to give him/her 100 lines to see right?)


let's say that you have 2 pages, a showData.php and getTable.php, in the showData.php you will need to load jQuery (wonderful for this) and add a little code, but where the table is to be placed, just add a div tag with an id="myTable" because we will get the data from the getTable.php file.

getTable.php file has to output only the table html code with all the data in, without no html, body, etc... the idea is to add inside the div called myTable all the code generated by getTable.php

let's imagine that getTable.php gets a page variable in the queryString, that will tell what page you should show (to use LIMIT in your mySQL or postgreeSQL database)


You can use jQuery plugin called datatables witch is one of my choices, check his example and how small code you need to write! just using jQuery and Datatables plugin.

The first description follows the jQuery.Load() to load the getTable.php and add as a child of the div and wold do this for the previous and next buttons, passing a querystring with the page that the user requested. It's to simple and you can see the website for that, if you prefer to use the DataTables plugin, then just follow their examples :)

if you, after all this need help, drop me a line.

balexandre
There will only be one person viewing this page - the person managing orders. I want to have a 'live' order page so that orders can be monitored and prepared as they come in.
Tray
+1  A: 
<META HTTP-EQUIV=Refresh CONTENT="15; URL=<?php print $PHP_SELF ?>">

This should be in between the head tags.

-or-

header('Refresh: 15');

This should be before the head tag and directly after the html tag.

As said by balexandre, a different method should be used. One that does not require a database hit every 15 seconds for every single user that is connected to the site. But, there is your answer anyways.

Kevin Crowell
Thank you. I'm pretty new to the whole Ajax thing - are there any other methods of doing this that you could recommend?
Tray
I too am curious how you would do this *without* querying the database? A flat file?
Mark
You can't refresh the database content without querying it. The point is, you may want to avoid doing this. Maybe have a refresh link that the user can use. Although, since you have said that only 1 user will be using this part of the page, you should be fine.
Kevin Crowell
-1 Where's the async javascript call part? you should not need to update the entire page, that's to 90's it's 2009! :) he should only update the data, nothing else.
balexandre
A: 

Although, balexandre makes a very good point, if you do decide that you need a refresh, you could simply do something like this in your JavaScript:

window.onload = function( )
{
     setTimeout( 'window.location.refresh( )', 1500 );
}

(I've not tested the above code, so syntax may need to be tweaked a little, but you get the idea)

KOGI