Meilleure façon de collecter des données utilisateur sur une page, de les afficher sur la même page tout en préservant le reste de la page

Question

Je suis en train de créer une application Web qui comporte une section dans laquelle l'utilisateur voit un graphique (extrait de une base de données de graphiques) et est invité à répondre à quelques questions. Une fois que l'utilisateur a soumis sa contribution, je voudrais afficher ses réponses plus les réponses suggérées sur la même page.

J'ai construit la plupart des fonctionnalités déjà, mais je ne suis pas sûr quelle est la meilleure méthode à utiliserpour montrer à la fois les réponses des utilisateurs et les réponses proposées sur la même page. En ce moment (voir ci-dessous), j'utilise une grosse instruction if qui vérifie si le formulaire a été soumis et, si oui, montre les dernières réponses soumises par l'utilisateur et les réponses suggérées. Si le formulaire n'a pas été envoyé, un graphique est affiché.

Le problème est qu'une fois que le formulaire est soumis (la partie else de l'instruction), l'utilisateur doit toujours voir le graphique. Je pense que je pourrais réafficher le graphique en stockant l'identifiant dans $ _SESSION et le tirer à nouveau dans l'instruction else, mais cela semble maladroit. Quelqu'un peut-il recommander quelle serait la meilleure façon de le faire (je suis ouvert à l'utilisation de jquery ou d'ajax, même si je devrais me mettre au courant)?

if(!isset($_POST['submit'])) 
    { 
     // some code to determine which chart to pull 

     if(mysql_num_rows($query)) 
     { 
      while($result = mysql_fetch_array($query)) 
      { 
       $dir = "images/"; // set directory variable 

       // open the directory 
       if($opendir = opendir($dir)) 
       { 
        // display the chart to the user 

       } 
      } 

      // update db table to note that user has seen this problem 

     ?> 
     <!-- ask for insights --> 
     <form action="charts.php" method="POST"> 

      <input type="text" name="insight[]" placeholder="insight goes here!" /> 
      <input type="text" name="insight[]" placeholder="more goes here!" /> 
      <input type="text" name="insight[]" placeholder="don't give up yet" /> 
      <input type="submit" name="submit" value="Submit data" /> 
     </form> 

     <?php 
     } 
     else // throw an error if all questions have been done! 
      { 
       bringBacktogo($id, $p_type, $count); 
      } 
    } 

    else 
    { 

      // some code to show suggested chart insights 

      // some code to pull user answers from form above and show them 
    } 

Answer 1

essayer ce jquery, et faire toutes les choses dans le targetPage.php

$("#targetDiv").load("targetPage.php",$("#form").serializeArray());