Jump to content

Giving up on autoscroll


soma56

Recommended Posts

After searching for hours on trying to figure out how to autoscroll the new contents that are echoed from a php script into a box (that automatically scrolls to the bottom as new content arrives) - I'm searching for another for another solution. Is there a way to clear the contents of a css box using php? Or is it that once something is echoed then that's it?

Link to comment
Share on other sites

I guess I should have been more specific. I'm looking for a way to give the user a status update. As the update changes I need to echo that output.

 

If I have hundreds of new lines of status updates the page will scroll down - so I placed everything in a simple CSS box:

 

<div id="divExample" style="width: 315px; height: 200px; overflow:auto; border: 2px solid black;">

<?PHP MY PHP CODE ?>

</div>

 

However, there is no way to continuously scroll to the bottom as new lines are added within the box. Hence the status box stays at the top as new lines are added. This is useless to the user if they have to scroll down every 5 seconds to see the status. I origanally tried to see if there was a way to solve this with PHP a couple of weeks ago:

 

http://www.phpfreaks.com/forums/index.php?topic=301015.0

 

I soon found out there was not. One of the members here suggested javascript. For the past 6 hours I've been trying to figure it out with out any luck. So, my simple inquiry here was to see if there was a function that could clear the contents of a text box with php. This was I would be able to echo the new contents (status update) in the same spot within the box without any scrolls at all. Being a php programmer for around a month I know it sounds like a stupid question however I had to ask it to see if it was possible as I really don't know where to turn to make this work.

Link to comment
Share on other sites

The simple answer is no, there isn't any php that will do this.

 

Maybe seeing the process of data flow will help you understand a little better:

 

1) User types a URL into their browser. The browser looks up the address of the server where this URL is hosted, and accesses the server.

2) The server generates HTML to be sent to the browser. In the case of PHP, the server will run through a php script, and the php script will generate the HTML.

3) The server sends the HTML to the browser

4) The browser takes the HTML and renders it as a web page. At this point, the server and PHP are out of the process. Neither the server nor PHP can directly affect the page here, as the data is all on the users PC and not on the server anymore.

5) The browser executes any javascript that exists in the data sent from the browser (actually, this can also happen during step 4, depending on how the javascript is set up). Javascript is run on the browser, and can manipulate the data on the page.

 

Now, depending on the javascript script, you can also have the following (called Ajax)

6) The javascript on the page will make a request to the server in the background. The javascript will send that request to a particular URL. This essentially works the same as step one, though this time it is initiated by the javascript, rather than the user.

7) The server generates some data (not necessarily HTML, and for that matter, often/usually not HTML). The server then sends this data back to the javascript function that made the request.

8 ) The javascript takes the received data, and does something with it. This often will be to alter the HTML on the page in some way, though this is not necessarily the case. For that matter, in some situations, no data is even sent back from the server in step seven.

 

How this relates to your original problem: You want to do steps 6 - 8. You need to send a request to the server for newly released updates (step 6), have the server generate them (step 7), and have your script update the HTML on the page (step 8 ). PHP doesn't do anything to the page in this case, it is all done by javascript. Which is why the short answer to your question was 'no'.

 

You have a couple of choices in how you can do this. The most efficient way is probably to send back the data for only the newest updates in JSON format, then have your javascript parse that, add the newest updates to the updates, and delete any old updates. However, while this is the most efficient method, it is probably also the most difficult. An easier method would be to generate all the HTML for the most recent X number of updates (where X is the number of updates you want to show) in step 7, then send it back to the browser as is, replacing all the current data with all the new data. If there are no updates, the data will look exactly the same, and if there are updates, the data will change.

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.