Bonjour à tous,

J'ai créé une page afin de m'afficher un tableau basé sur un json et sur une entrée de l'utilisateur.

Mon problème est le suivant : lorsque je mets l'entrée utilisateur dans mon formulaire et que je la soumets (bouton go), celle-ci s'efface et n'est pas prise en compte.

Plus étonnant, si j'entre à nouveau exactement la même entrée, elle est prise en compte et mon tableau s'affiche sans aucun problème.

J'ai cherché à inverser les positions mais rien n'y fait...

Mon script :

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
function get_values(){
/*  for(i=0; i = document.getElementByID("mon_tableau").getElementsByTagName('tr').length; i++){
      document.getElementById("mon_tableau").deleteRow(i);
      console.log("Coucou");
  } (J'essaye ici d'effacer l'ancien tableau lors d'un nouveau clic mais ça ne marche pas pour le moment
*/
  var json = "http://****/get_json.php?callback=?";
  if(document.getElementById('Filtre_ti').value != ""){
    json = json + "&nom_TI=" + document.getElementById('Filtre_ti').value;
  }
  console.log(json);
  var titre_colindex = 0;
  $.getJSON(json ,function(data){
    newRow = document.getElementById('mon_tableau').getElementsByTagName('tbody')[0].insertRow(-1);
    $.each(data[0], function(index, valeur){ //Pour chaque colonne
      newCell = newRow.insertCell(titre_colindex);
      newCell.innerHTML = index;
      titre_colindex+=1;
    });
    $.each(data, function(i,ti){
       var newRow;
       var newCell;
            newRow = document.getElementById('mon_tableau').getElementsByTagName('tbody')[0].insertRow(-1);
            newCell = newRow.insertCell(0);
            newCell.innerHTML = ti.TI;
        var i_colindex=1;
            $.each(ti, function(index, valeur){
              if(index != "TI"){
                newCell = newRow.insertCell(i_colindex);
                newCell.innerHTML = valeur;
                i_colindex+=1;
              }
            });
          });  //End each
        console.log("End fct");
        });    //End getJSON
}
Mon formulaire et mon tableau de test :

Code html : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<FORM action="#" class="tableau"> <!--Creation du formulaire pour l'entree utilisateur-->
    </br></br>Quel TI recherchez vous ?</br></br>
    <TABLE BORDER=0>
        <TR>
            <TD>Nom du TI</TD>
            <TD>
                <INPUT type="text" name="nom_TI" id="Filtre_ti">
            </TD>
        </TR>
        <TR>
            <TD COLSPAN=1>
                <button onclick="get_values()">GO</button>
            </TD>
        </TR>
    </TABLE></br>
    <table id="mon_tableau" border=1><tbody></tbody></table>
</FORM>

Avez vous des pistes ?

Merci,
Corentin.