web-dev-qa-db-fra.com

HTML - Modifier \ Mettre à jour le contenu de la page sans rafraîchir \ recharger la page

J'obtiens les données de la base de données et les affiche dans une div ... ce que je veux faire, c'est quand je clique sur un lien, cela devrait changer le contenu de la div

une option consiste à passer le paramètre via l'URL à lui-même et à recharger la page ...

Je dois le faire sans rechargement\rafraîchissement ...

<?php   
    $id   = '1';

    function recp( $rId ) {
        $id   = $rId;
    }
?>

<a href="#" onClick="<?php recp('1') ?>" > One   </a>
<a href="#" onClick="<?php recp('2') ?>" > Two   </a>
<a href="#" onClick="<?php recp('3') ?>" > Three </a>

<div id='myStyle'>
<?php
    require ('myConnect.php');     
    $results = mysql_query("SELECT para FROM content WHERE  para_ID='$id'");

    if( mysql_num_rows($results) > 0 ) {
        $row = mysql_fetch_array( $results );
        echo $row['para'];
    }
?>
</div>

Le but est que lorsque je clique sur l'un des liens, le contenu des variables div et php soit mis à jour sans rafraîchir .... de sorte que l'utilisateur puisse voir les nouvelles données et après cela si une requête est effectuée c'est sur une nouvelle variable\s

ps je sais que ça va nécessiter un peu AJAX mais je ne connais pas AJAX .. alors s'il vous plaît répondez avec quelque chose par lequel je peux apprendre ... mes connaissances sont limitées au HTML, PHP, certains JavaScript et certains jQuery

phpmysqlhtmlajaxjquery
37
Moon

Vous avez la bonne idée, alors voici comment procéder: les gestionnaires onclick s'exécutent côté client, dans le navigateur, vous ne pouvez donc pas appeler directement une fonction PHP PHP . Au lieu de cela, vous devez ajouter une fonction JavaScript qui (comme vous l'avez mentionné) utilise AJAX pour appeler un script PHP et récupérer les données. À l'aide de jQuery, vous peut faire quelque chose comme ça:

<script type="text/javascript">
function recp(id) {
  $('#myStyle').load('data.php?id=' + id);
}
</script>

<a href="#" onClick="recp('1')" > One   </a>
<a href="#" onClick="recp('2')" > Two   </a>
<a href="#" onClick="recp('3')" > Three </a>

<div id='myStyle'>
</div>

Ensuite, vous mettez votre PHP dans un fichier séparé: (je l'ai appelé data.php dans l'exemple ci-dessus)

<?php
  require ('myConnect.php');     
  $id = $_GET['id'];
  $results = mysql_query("SELECT para FROM content WHERE  para_ID='$id'");   
  if( mysql_num_rows($results) > 0 )
  {
   $row = mysql_fetch_array( $results );
   echo $row['para'];
  }
?>
44
casablanca

jQuery fera le travail. Vous pouvez utiliser soit la fonction jQuery.ajax, qui est une fonction générale pour effectuer des appels ajax, soit ses wrappers: jQuery.get, jQuery.post pour obtenir/publier des données. Son très facile à utiliser, par exemple, consultez le tutoriel this , qui montre comment utiliser jQuery avec PHP.

2
Sorantis