javascript - Ajax page return nothing on refresh the page button click -


i made ajax function calling php pages /pages folder , call pages in ajax-container div, when click on refresh page button history pushstate working because see page in adress, it's loading content of index.php nothing happens in ajax-container. how can page called when refresh page?

htacces:

options +followsymlinks    rewriteengine on    rewritebase /  rewriterule ^([a-za-z0-9\-]*).php$ index.php?p=$1 [l]

ajax-container:

<div id="ajax-container">  <?php  $d = "pages/";  if (isset($_get['p'])) {      $p = strtolower($_get['p']);      if (preg_match("/^[a-z0-9\-]+$/", $p) && file_exists($d . $p . ".php")) {          include $d . $p . ".php";      } else {          include $d . "404.html";      }  } else {      include $d . "home.php";  }  ?>  </div>

and ajax function:

var afficher = function(data, page) {        $('#ajax-container').delay(200).fadeout(250, function() {          $('#ajax-container').empty();          $('#ajax-container').append(data);          $('#ajax-container').fadein(100, function() {});        });  };    var lastrequest = null;  if (lastrequest !== null) {      lastrequest.abort();  }    var loadpage = function(page, storehistory) {      if (typeof storehistory === 'undefined') {          storehistory = true;      }          lastrequest = $.ajax({          url: "pages/" + page,          cache: false,          success: function(html) {              afficher(html, page);              if (storehistory === true) {                  history.pushstate({                      'key': 'value',                      'url': page                  }, '', page);              }          },          error: function(xmlhttprequest, textstatus, errorthrown) {              afficher('erreur lors du chagement de la page');          }      });        return false;  };    window.addeventlistener('load', function() {      settimeout(function() {          window.addeventlistener('popstate', function(e) {              if (e.state === null) {                  loadpage('home.php');              } else {                  loadpage(e['state']['url'], false);              }          });      }, 0);  });

i see, don't understand jquery since i've worked pure javascript ajax. however, know things check.

1-is php echoing things out? if php file ajax, won't display unless information being echoed out.

2-i don't see innerhtml, experience (again used pure javascript ajax), echoed php code put in div's innerhtml. example div: before ajax:

<div id="ajax-container">     hello </div> 

ajax gets php file:

ajax finishes , content ready... ( xmlhttp=xmlhttprequest() )

document.getelementbyid("ajax-container").innerhtml=xmlhttp.responsetext;//responsetext= whatever php echoed out 

after ajax:

<div id="ajax-container">    hi </div> 

this replaces div's content, following add it:

document.getelementbyid("ajax-container").innerhtml.=xmlhttp.responsetext;                          note period concat^ 

3- if still having problems, open browser developer tools->network tab->php file name

this allow see whatever php file saying (var_dumps, echos, errors if error reporting stuff allows it)


Comments