0

I have problems to understand how the web pages are refreshed using jquery...

I start from this test page : http://www.sogival.com/m-index.php From there, I generate a list of areas from a sql database, each object of the list pointing to a web page with at the following url : http://www.sogival.com/m-area.php?page_id=1 (or any other number 1..7). But when I click on any of those links, I get an almost empty page, although the URL is correct, since the parts coming from sql are not populated. But what is strange for me is that if I hit the F5 key, then the page is displayed properly! And this is a real mystery for me... Why is the page not displayed properly the first time ?

I also have a second question : I would like to use the following script to populate 2 distinct areas on the jquery page, namely h3 and h4. However, what ever I do, only the first term (here h3) is populated, and the second stays empty! Could you explain me how to populate both ? Note that in this example, data.items.length = 1, so the for loop is only passed once.

<script type="text/javascript">
        $(function(){
        var list = '';
        $.getJSON("http://www.sogival.com/m-fetch.php",  // fichier
           {"page": "dest", "page_id": 35, "lang" : "fr"},  // paramètres
           function(data){  // fonction

           for (var i = 0; i < data.items.length; i++) { 
                   $("h3").append(data.items[i].name).listview("refresh");
                   $("h4").append(data.items[i].general).trigger("refresh");
           }
        });
    });

    </script>
Matt Ball
  • 354,903
  • 100
  • 647
  • 710
sanji
  • 13
  • 3

1 Answers1

0

This is most likely due to caching. Try adding a timestamp to avoid this:

function myTimestamp(){
tstmp = new Date();    
return tstmp.getTime();
}

and then in your code:

$.getJSON("http://www.sogival.com/m-fetch.php?" + myTimestamp(),
// continue
Amir
  • 1,882
  • 17
  • 22
  • 1
    Just found out that there is a similar question + answer like this here: http://stackoverflow.com/questions/367786/prevent-caching-of-ajax-call – Amir Apr 22 '12 at 15:38
  • Seems not to work for me... I changed the code to add : var d = new Date() var n = d.getTime() and then to pass this value n in those the php page used to select data from the sql database and the link itself, but again, only after a refresh F5 do I see the page populated. So now, I have $.getJSON("http://www.sogival.com/m-fetch.php", {"page": "area", "page_id": , "lang" : "", "n" : n}, And indeed, the link http://www.sogival.com/m-dest.php?page_id=35&n=1335114814018 works only once it is refreshed... – sanji Apr 22 '12 at 17:14
  • In that case, try the jQuery built cleaner solution: `$(document).ready(function() { $.ajaxSetup({ cache: false }); });` It should work (for $.ajax, $.getJSON, etc.). – Amir Apr 22 '12 at 18:24
  • I agree... it should work... but it simply doesn't! And I have not a single clue on how to solve it. Strange thing though, every time I type in firefox the following URL : http://www.sogival.com/m-area.php?page_id=1&n=1234567890 (with n being any number), the page is displayed properly, whether n is changed or not. It also work if I change page_id value... Hence it must be something preventing the new page to fully change when I click on the list on http://www.sogival.com/m-index.php If you have any suggestion, please let me know... – sanji Apr 22 '12 at 18:54
  • Now I see. you need to put your code inside the `$(document).ready(function() { ... }` function. All of if. you can replace the `$(function(){ ... }) ` with `$(document).ready(function() { ... })`, I think your code just runs before the page finishes loading. – Amir Apr 22 '12 at 19:13
  • I appreciate your patience. Still not working. Now I have : – sanji Apr 22 '12 at 19:58