Utilisation AJAX pour recherche dans BDD : Bouton submit inactif

michgoarin Messages postés 11 Statut Membre -  
michgoarin Messages postés 11 Statut Membre -
Bonjour à tous,
Ami(e)s expert, voici une question pour vous :
J'ai un formulaire qui me permet d'effectuer une recherche dans une BDD en temps réel.
Cette recherche me permettrait de faire une sortie de stock. Le seul problème : au chargement des lignes le bouton "submit" est inactif.
Pourriez vous m'expliquer pourquoi ? Auriez vous une solution ?

Vous l'aurez compris, il y a deux fichiers :
- Le formulaire,
- Le résultat.

Le formulaire : 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "[http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd]">
<html xmlns="[http://www.w3.org/1999/xhtml]">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Sortie Article</title>
<!-- Include jQuery  -->
<script src="[https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js]" type="text/javascript"></script>
 
<title>Accueil</title>
<script type="text/javascript">
$(document).ready( function() {
   // détection de la saisie dans le champ de recherche
   $('#q').keyup( function(){
  $field = $(this);
  $('#results').html(''); // on vide les resultats
  $('#ajax-loader').remove(); // on retire le loader
 
  // on commence à traiter à partir du 2ème caractère saisie
  if( $field.val().length > 1 )
  {
    // on envoie la valeur recherché en GET au fichier de traitement
    $.ajax({
  type : 'GET', // envoi des données en GET ou POST
  url : 'sortie_materiel_search.php' , // url du fichier de traitement
  data : 'q='+$(this).val() ,// données à envoyer en  GET ou POST
  beforeSend : function() { // traitements JS à faire AVANT l'envoi
   $field.after('<img src="ajax-loader.gif" alt="loader" id="ajax-loader" />'); // ajout d'un loader pour signifier l'action
  },
  success : function(data){ // traitements JS à faire APRES le retour d'ajax-search.php
   $('#ajax-loader').remove(); // on enleve le loader
   $('#results').html(data); // affichage des résultats dans le bloc
  }
    });
  }  
   });
 });
 
</script>
</head>
 
<body id="top">
 
 <h2>Sortie Article</h2>
  <div class="recherche_article">
  <!--debut du formulaire-->
  <form class="ajax" action="bdc.php" method="get">
   <p>
    <label for="q">Rechercher un article</label>
    <input type="text" name="q" id="q" />
   </p>
  </form>
  </fieldset>
  <!--fin du formulaire-->
  </div>
  <!--preparation de l'affichage des resultats-->
  <div id="results"></div>   
 <hr style="height: 3px; color: #ffffff; width: 100%; border: 1px dashed #000;"></hr>
</body>
</html>


La recherche et le résultat :
Code : 
<?php
// Connexion à la base de données
include("menu//chiens.php"); 
$result = $bdd->query("SELECT*FROM `stock` WHERE REF_INTERNE LIKE '%". safe( $_GET['q'] ) ."%' OR REFERENCE_MARQUE_PROPOSEE LIKE '%". safe( $_GET['q'] ) ."%' OR GRANDE_FAMILLE LIKE '%". safe( $_GET['q'] ) ."%' OR FAMILLE LIKE '%". safe( $_GET['q'] ) ."%' OR DESIGNATION LIKE '%". safe( $_GET['q'] ) ."%' ORDER BY REF_INTERNE ASC"); 
 $i=0;
 // début du tableau
 echo '<div class="article-result">';
 echo ("<table width='780'>\n");
 echo ("<tr>");
 echo ("<td style='width:55px; font-size:10px;'><strong>REF INTERNE</strong></td>");
 echo ("<td style='width:290px; font-size:10px;'><strong>DESIGNATION</strong></td>");
 echo ("<td style='width:120px; font-size:10px;'><strong>FOURNISSEUR</strong></td>");
 echo ("<td style='width:90px; font-size:10px;'><strong>REF FOURNISSEUR</strong></td>");
 echo ("<td style='width:90px; font-size:10px;'><strong>MARQUE</strong></td>");
 echo ("<td style='width:45px; font-size:10px;'><strong>STOCK</strong></td>");
 echo ("<td style='width:45px; font-size:10px;'><strong>PRIX (HT)</strong></td>");
 echo ("<td style='width:110px; font-size:10px; text-align:center;'>QTT</td>");
 echo ("<td width='5'></td>");
 echo ("<td width='20' align='center'><strong>Valider</strong></td>");
 echo ("</tr>");
 // On récupère tout le contenu de la table 
 while($row = $result->fetch()){
   //Affichage des résultats
   echo ("<tr bgcolor='".( ($i++ % 2 == 0) ? '#dddddd' : '#eeeeee' )."'>");
   echo ("<td style='width:55px; font-size:11px;'>".$row['REF_INTERNE']."</td>");
   echo( "<td style='width:290px; font-size:11px;'>".$row['DESIGNATION']."</td>");
   echo( "<td style='width:120px; font-size:11px;'>".$row['FOURNISSEUR']."</td>");
   echo( "<td style='width:90px; font-size:11px;'>".$row['REFERENCE_MARQUE_PROPOSEE']."</td>");
   echo( "<td style='width:90px; font-size:11px;'>".$row['MARQUE_PROPOSEE']."</td>");
   echo( "<td style='width:45px; font-size:11px;'>".$row['STOCK']."</td>");
   echo( "<td style='width:45px; font-size:11px;'>".$row['PRIX_UNITAIRE']."</td>");
   // Début du formulaire de sortie d'article
   echo( "<form action='traitement_sortie_article.php' method='post' name='traitement_sortie_article' id='traitement_sortie_article'>");
   echo ("<td align='center'><input type='number' name='qtt_saisie' id='qtt_saisie' min='0'/></td>");
   echo( "<td>
   <input type='hidden' name='ref_interne' value='".$row['REF_INTERNE']."' id='ref_interne'>
   <input type='hidden' name='id_article' value='".$row['ID']."' id='id_article'>");
   echo( "<td align='center'><input type='submit' name='selectionner' value='S'></td>");
   echo ('</tr>'."\n");
   echo ('</form>');
 }
echo ('</table></div>'."\n");
$result->closeCursor();
 
/*****
fonctions


*
**
***
****
*****/function safe($var){ $var = addcslashes($var, '%_'); $var = trim($var); $var = htmlspecialchars($var); return $var;}?>



Dans l'attente d'une réponse de votre part, par avance merci.


EDIT : Ajout des balises de code (la coloration syntaxique).
Explications disponibles ici :ICI

Merci d'y penser dans tes prochains messages.

2 réponses

Réponse 1 / 2
Pitet Messages postés 2845 Statut Membre 527
 
Salut,

La construction de ton formulaire dans la réponse ajax n'est pas correct, tu as donc une erreur de syntaxe html au niveau du formulaire ce qui provoque son non fonctionnement.

Pour rappel les règles html :
- la balise tr doit être un enfant direct de la balise table
- la balise td doit être un enfant direct de la balise tr

La balise form peut donc soit être contenu dans une cellule du tableau (dans une balise td) soit contenir le tableau en entier. Exemple : 
<!-- correct -->
<table>
  <tr>
    <td>
      <form>

      </form>
    </td>
  </tr>
</table>

<!-- correct -->
<form>
  <table>
    <tr>
      <td>

      </td>
    </tr>
  </table>
</form>

<!-- incorrect -->
<table>
  <form>
    <tr>
      <td> 

      </td>
    </tr>
  </form>
</table>

<!-- incorrect -->
<table>
  <tr>
    <form>
      <td> 

      </td>
    </form>
  </tr>
</table>


Bonne journée
0
Réponse 2 / 2
michgoarin Messages postés 11 Statut Membre
 
Bonsoir à tous,
Au travers des recherches effectuées, voici les corrections : 
<?php
// Connexion à la base de données
include("menu//chiens.php"); 
$result = $bdd->query("SELECT*FROM `stock` WHERE REF_INTERNE LIKE '%". safe( $_GET['q'] ) ."%' OR REFERENCE_MARQUE_PROPOSEE LIKE '%". safe( $_GET['q'] ) ."%' OR GRANDE_FAMILLE LIKE '%". safe( $_GET['q'] ) ."%' OR FAMILLE LIKE '%". safe( $_GET['q'] ) ."%' OR DESIGNATION LIKE '%". safe( $_GET['q'] ) ."%' ORDER BY REF_INTERNE ASC"); 
 $i=0;
 // début du tableau
 echo ("<div class='article-result'>
 <table width='780'>
 <tr>
 <td style='width:55px; font-size:10px;'><strong>REF INTERNE</strong></td>
 <td style='width:290px; font-size:10px;'><strong>DESIGNATION</strong></td>
 <td style='width:120px; font-size:10px;'><strong>FOURNISSEUR</strong></td>
 <td style='width:90px; font-size:10px;'><strong>REF FOURNISSEUR</strong></td>
 <td style='width:90px; font-size:10px;'><strong>MARQUE</strong></td>
 <td style='width:45px; font-size:10px;'><strong>STOCK</strong></td>
 <td style='width:45px; font-size:10px;'><strong>PRIX (HT)</strong></td>
 <td style='width:45px; font-size:10px; text-align:center;'>QTT</td>
 </tr>");
 // On récupère tout le contenu de la table 
 while($row = $result->fetch()){
   //Affichage des résultats
   echo ("
    <tr style='background-color:".( ($i++ % 2 == 0) ? '#dddddd;' : '#eeeeee;' )."'>
     <td style='width:55px; font-size:11px;'>".$row['REF_INTERNE']."</td>
     <td style='width:290px; font-size:11px;'>".$row['DESIGNATION']."</td>
     <td style='width:120px; font-size:11px;'>".$row['FOURNISSEUR']."</td>
     <td style='width:90px; font-size:11px;'>".$row['REFERENCE_MARQUE_PROPOSEE']."</td>
     <td style='width:90px; font-size:11px;'>".$row['MARQUE_PROPOSEE']."</td>
     <td style='width:45px; font-size:11px;'>".$row['STOCK']."</td>
     <td style='width:45px; font-size:11px;'>".$row['PRIX_UNITAIRE']."</td>
     <td align='center'>
      <form action='traitement_sortie_article.php' method='post'>
       <input type='hidden' name='ref_interne' value='".$row['REF_INTERNE']."' id='ref_interne'>
       <input type='hidden' name='id_article' value='".$row['ID']."' id='id_article'>
       <input type='number' name='qtt_saisie' id='qtt_saisie' min='0'/>
       <input style='display: inline;' type='submit' name='selectionner' value='S'>
      </form>
     </td>
    </tr>
   ");
 }
echo ("</table></div>");
$result->closeCursor();
/***********************


*
**
***
**** fonctions ***************************/function safe($var){ $var = addcslashes($var, '%_'); $var = trim($var); $var = htmlspecialchars($var); return $var;}?>


En fait, les balises <form></form> étaient mal placées.
Merci de votre aide.

--
0

Discussions similaires

recherche à partir de la barre d'adresse
Sylviane -
Lulin -

11 réponses
Recherche de pairs sur utorrent bloqué
flo.h -
Claire -

4 réponses
Réglage chaine de la TNT FR3 TF1 A2 TMC
Yamina -
Redbart -

1 réponse
probléme avec ajax svp
marwen109 -
Groarh -

4 réponses
Ressource demandée en cours d'utilisation
Taylow -
Elaura23 -

11 réponses