load info once from external page

[atomicrabbit]

I am creating a list in table rows. When the row is clicked, it expands to show extra information or contracts to hide it. The extra information is loaded from an external page on the internet. What I would like to do is load the information for each item when the row is expanded. Then If that same row is closed/contracted, the information stays there and doesn't get reloaded when the item is opened again. I know this will involved a bit of javascript and I already coded the javascript to expand/contract the table row. All I want to do is have the ability to load each item once, when it is needed, and not have to load it again (maybe unless the page is reloaded)

 

I am not an expert in php, but I know a good amount to get me by. That being said, can someone provide suggestions if what I am asking is not a smart idea. Maybe cache the information that is read and always use the cached info but be able to update the information from the external page if needed. Again, I am just throwing around ideas and I don't know how to accomplish most of it. Any suggestions welcome. thanks

[Fadion]

For simple show/hide i use a code like:

 

onClick="this.styles.display='none'"

 

A simple if statement to get the state and u make it with display=none and display=block. In this way u have the information loaded only when the page is loaded. Hope it helped.

[atomicrabbit]

oh.. yes yes.. Like I said. I already coded the javascript part that shows/hides the table. But I need to load info that will go into the hidden table row, from another site. But I don't want to load the info EVERY time the user clicks to show the row. I want it to load ONCE the first time the user shows it, and then the user should be able to show/hide the info as many times as they want without it reading from the external site again.

[trq]

I would think the easiest solution would be to store the data in a Javascript array when it is first loaded.

[Fadion]

Am i being dumb here or what. Shouldnt the php script which parses the remote information be loaded once and the javascript only hides/shows the html element. The information will be retrieved only once.

[atomicrabbit]

Am i being dumb here or what. Shouldnt the php script which parses the remote information be loaded once and the javascript only hides/shows the html element. The information will be retrieved only once.

Well... yes, but no. The problem with that is the php will load the extra info for ALL of items in the list. This will put a large load on the external site every time my page is reloaded. Therefore, I only want the extra info to load when the user expands each item.

 

For example:

- user expands Row A --> Row A's extra information is loaded for the first time and does not need to be loaded again.

- user expands Row F --> Row F's extra information is loaded for the first time and does not need to be loaded again.

- user contracts Row F, then expands Row F again --> the information should still be there from the first load and not be loaded again from the external site.

[Fadion]

Oh ok i had a doubt that was the problem. I assumed u needed to load small amounts of remote information. Dont know how to help anyway.

[atomicrabbit]

I would think the easiest solution would be to store the data in a Javascript array when it is first loaded.

hmm.. is that the easiest way? Maybe if I load a separate php file that gets teh info, into an iFrame in the hidden table row (when the row is expanded). Would the iFrame reload when it is hidden then shown?

[Ken2k7]

I don't see why you need it to be an EXTERNAL file, but it'll be the same. I recommend you just write all the HTML and php you need on the same page such that when the person visits the site, all the information is already on the page such that if he/she clicks the link, it'll show up and if he/she clicks the link again, it'll hide itself.

 

On an external, just make a function and call upon it. Make sure you use include.

 

You can make the external have many functions then call upon them depending on which link is clicked. Of course, then you'll need to code a part where it checks to see if the info has already been loaded so it doesn't call the function again.

[Ken2k7]

I would think the easiest solution would be to store the data in a Javascript array when it is first loaded.

hmm.. is that the easiest way? Maybe if I load a separate php file that gets teh info, into an iFrame in the hidden table row (when the row is expanded). Would the iFrame reload when it is hidden then shown?

It won't reload unless the link redirects the user.

[atomicrabbit]

It won't reload unless the link redirects the user.

So how can I get the iFrame to load ONLY when the user expands it for the first time? I don't want all the iFrames to load at once, only when the user expands one of the items

[Ken2k7]

First of all, everything will be loaded on the site upon the user's visit. It'll stay there,  but just hidden until the user clicks the link. The data will then show. That's it. Work on that.

[atomicrabbit]

First of all, everything will be loaded on the site upon the user's visit. It'll stay there,  but just hidden until the user clicks the link. The data will then show. That's it. Work on that.

 

err... but I don't want it to load it ALL at once. I just want the each item's extra info only when needed. So if the user expands Row a, it only loads Row A's extra info, and only once. It would defeat the purpose to load it all at once. Too much load on the external site, and unnecessary load if the user isn't going to look at ALL of the items extra info. Maybe I can use javascript to write the iframe dynamically?? is that possible?

[Ken2k7]

err... but I don't want it to load it ALL at once. I just want the each item's extra info only when needed. So if the user expands Row a, it only loads Row A's extra info, and only once. It would defeat the purpose to load it all at once. Too much load on the external site, and unnecessary load if the user isn't going to look at ALL of the items extra info. Maybe I can use javascript to write the iframe dynamically?? is that possible?

You don't need an iframe. Just make functions in your external php script.

 

So like if the user clicks row a, call upon function RowA() in the external or something like that. So it won't load everything. Will recalling RowA() be a problem? I mean will the data change if you call it more than once? I'm not sure how and iframe would help as php is a server-side language. So using an iframe isn't going to work that well - I think.

 

And also, the iframe will most likely load more info than you need. It gets the page and loads the whole page!

[atomicrabbit]

You don't need an iframe. Just make functions in your external php script.

 

So like if the user clicks row a, call upon function RowA() in the external or something like that. So it won't load everything. Will recalling RowA() be a problem? I mean will the data change if you call it more than once? I'm not sure how and iframe would help as php is a server-side language. So using an iframe isn't going to work that well - I think.

 

And also, the iframe will most likely load more info than you need. It gets the page and loads the whole page!

no no... it's not a problem with the data changing. It's the fact that the data will most likely NOT change. THat's why it shouldn't be loaded every time the row is expanded. I don't understand why I would have a function for each row. If I understand what your saying, I should have a function for each row, i.e. RowA(), RowB(), RowC(), etc, and call each function when the user expands each row. The problem with that is that there aren't already functions for each row and it wouldn't make sense to make a function for each row.

 

The iFrame would load a local php file that I make. The php file would grab the specific information that I need from the external site. I would use a global javascript array to define each item as 0 or 1. If the value for row[1]=0 that means the data hasn't been loaded, so in javascript, it uses the .innerHTML function to write in the <iframe> code (which loads the php file I make).. so if my idea works... it would look something like this:

 

 

I would make a global array that holds all the items 0/1 value. The problem here is that I don't don;t how to dynamically make a global array in javascript using php.

<script>
function toggleRow(tableId){

  tbl = document.getElementById("row" + tableId);
  extra = document.getElementById("extraInfo" + tableId);

  if (tbl.style.display == 'none') {
     tbl.style.display = '';
     if (rowArray[tableId] == 0) {
          extra.innerHTML = "<iframe src='my_local_php_file.php'></iframe>";
          rowArray[tableId] = 1;
     }
  } else {
     tbl.style.display = 'none';
  }
}
</script>

<table>
  <tr onclick="togglerow("A");">
    <td>item name</td>
    <td>date</a>
  </tr>
  <tr id="rowA" style="display: none;">
    <td id="extraInfoA" colspan="2"></td>
  </tr>
  <!-- ... more similar rows -- diff info > rowB, rowC, rowD, etc ... -->
</table>

 

Obviously the initial table info (not including the extra info) is dynamically created with php

 

 

EDIT: I haven't fully tested it since I don't know how I would make the javascript array dynamically, but if a row is being expanded for the first time, its related array item should equal 0 and therefore print the <iframe> code into the extraInfo# <td> row and set the item in the array equal to 1. This would stop the iframe from being re-written to the <td> the next time it is expanded and from being reloaded.

 

I hope this all makes sense. 

[Ken2k7]

First of all, if the data is in a database, this is easier.

 

External:

function getIt($row){

// codes

}

 

That would trigger what row you're looking for and just go to the right database table. That would be one function.

[atomicrabbit]

First of all, if the data is in a database, this is easier.

 

External:

function getIt($row){

// codes

}

 

That would trigger what row you're looking for and just go to the right database table. That would be one function.

the "extra information" that I am getting from an external site is not in a database. It is from an html page.

[Ken2k7]

Okay? So what's the code you're using to get data from an HTML page? Is this like a form?

[atomicrabbit]

Okay? So what's the code you're using to get data from an HTML page? Is this like a form?

ok i've been thinking about my concept and I will probably store the information I grab from the other site into my own database. And I'll have an option to manually refresh/reload the information from the external site whenever I need. So let's now say the information is coming from a local database. I still don't want ALL the extra information to load at once when the main page loads. This is because the list is fairly long and it would be a pointless waste of bandwidth for the extra info to load at that time -- the user will MOST LIKELY not look at each and every individual item's extra info in the list. So let's say the code to get the extra info is just basic code that will query my SQL table for the info.

[atomicrabbit]

i figured out how I can do it, and it doesn't really involve php... well sorta. I'll explain the **basic** idea below.

 

In the php part, it will print a simple iFrame tag without any src:

<iframe id="myIFrame"></iframe>

 

then in javascript, on the link to expand the extra info section, i'll have an onClick event that calls a javascript function that would look a little like this:

 

<script>
function loadExtra()
{
target = document.getElementById("myIFrame");
if (!target.src) frObj.src = "http://www.mydomain.com/extra.php"; // this will link to a php file I made that will call all the extra info from the external page.

// some code will go here to expand the table cell to be shown
}
</script>

 

This will essentially allowt he user to expand the extra info section, and the javascript will check to see if the iFrame has a source. if not, it will load the page. If it does (meaning the item was already expanded at least once before), it won't do anything and will just expand the cell.

 

thanks for the help/suggestions everyone. It got my brain working a little