Charger dynamiquement PHP dans une page principale

Question

Je suis assez nouveau quand il s'agit de PHP et AJAX, donc je continue à courir dans les problèmes, et après avoir parcouru le web pour trouver des idées, je suis venu court. Je cherche une méthode pour charger dynamiquement le contenu (mélange PHP/HTML) sur une page principale. La page principale inclurait la navigation, et une fois que l'on clique sur un lien dans cette navigation, le contenu de la div de contenu principal changerait. Assez simple, c'est vrai, mais j'ai été un gros bus de lutte sur ce sujet.

La méthode que j'ai préférée jusqu'ici est CSS-Tricks Rethinking Dynamic Page Replacing Content qui utilise l'API HTML5 History. J'ai aimé le fait que cela permettait l'utilisation des boutons du navigateur avant et arrière, mais je n'arrivais pas à l'utiliser dans Chrome.

Ce n'est pas votre typique "aidez-moi à comprendre ce qui ne va pas avec mon code" question, donc je m'excuse à l'avance. La plupart du temps je cherche un peu de conseil sur la meilleure façon de trouver une solution à ce problème.

Answer 1

Cela peut être fait avec AJAX, vous aurez besoin d'un contenu/vue/ancre de page pour déterminer quel contenu est chargé, vous pouvez l'utiliser pour charger le contenu de votre php,

Heres un extrait de code jQuery qui utilise #hash pour déterminer le contenu, donc http://example.com/#home fera une demande de paiement ajax pour $_POST['view']='home'

$(function(){ 
    // Detect hashchange (browser back/forward buttons) 
    $(window).bind('hashchange', function() { 
     load_content(); 
    }); 
    // Init content 
    load_content(); 
}); 

function load_content(){ 
    //get the hash 
    var page = window.location.hash; 
    page = page.substring(1); 
    if(page == ''){ 
     page='home'; 
    } 

    //get the content, replace any - with/so php can route to sub actions ect 
    $.post("./", { 'view': page.replace("-","/") }, 
    function(data) { 
     //load the content into the load container 
     $("#load").html(data).fadeIn('slow'); 
    }); 
} 

<div id="load"></div> 

Ensuite, vous pouvez simplement trouver la route à votre script php avec l'intérieur:

$route  = explode('/',$_POST['view']); 
$controller = (!empty($route[0])) ? $route[0] : null; 
$action  = (!empty($route[1])) ? $route[1] : null; 

Answer 2

Aller avec Ajax ... J'étais dans une situation similaire il y a quelques semaines. Je ne savais pas grand-chose à ce sujet, mais ce site est très utile: http://www.w3schools.com/ajax/ajax_example.asp

Il a des exemples simples qui vous aideront à comprendre le fonctionnement des appels. J'espère que ça aide. Il est difficile de donner des conseils plus spécifiques puisque vous n'expliquez pas beaucoup sur votre application.

Answer 3

Voici un exemple simple pour vous faire comprendre:

Faire un appel ajax sur clic des liens de navigation,

<p id="test">CLICK ME</p> 

<p id="result">Your result</p> 

code Ajax dans les balises de script est la suivante:

$(document).ready(function() { 

$("#test").click(function(){ 

    $.ajax({ 
     url : 'testing.php', 
     type : 'GET', 
     async : 'true', 
     cache : 'false', 

     success : function(data, textStatus, xhr) 
     { 
      $('#result').empty().html(data); 
     }, 
    }); 

}); 
}); 

Remarque: l'URL d'appel ajax peut être une page php ou html ou même un fichier texte dans lequel vous avez le résultat à afficher dans la division de la page principale.