sélectionner dans la liste déroulante et redessiner le graphique

Question

J'ai cette exigence, j'ai un ensemble de graphiques, ce que je dois faire est de les redessiner pour la même liste de données lorsque je sélectionne le type de graphique d'une liste déroulante, mais je n'ai pas idée comment y parvenir, besoin d'aide s'il vous plaît? des tutoriels à ce sujet? mieux ..

Answer 1

Un moyen simple serait de créer un contrôleur/méthode qui prend l'ID ou le nom du graphique comme argument et qui génère ce graphique pour vous à la volée. Utilisez ensuite jQuery pour effectuer des appels ajax sur ce contrôleur/méthode, récupérer le graphique généré et remplacer celui existant sur la page.

Exemple mise en œuvre:

<script type="text/javascript"> 
    $(function(){ 
     $('select[name=graphList]').change(function(e){ 
      e.preventDefault(); 
      var graphID = $(this).val(); //returns the selected option's value 

      // make an ajax call to the method/controller to fetch the new graph HTML 
      $.ajax({ 
       // append (new Date()).getTime() to url to prevent session timeout 

       url:"http://your_url_here/controller/method/" + graphID + "/" + (new Date()).getTime(), 
        success: function(data){ 
          // data should now contain the graph HTML for the new generated graph 
          // simply put this html into the graph div 
          $('#graph').html(data); 
         } 
      }); 
     }); 
    }); 
</script> 

<!-- HTML example below --> 
<select name="graphList"> 
    <option value="1">Graph 1</option> 
    <option value="2">Graph 2</option> 
    <option value="3">Graph 3</option> 
</select> 

<div id="graph"> 

</div>