Utilisation AJAX pour recherche dans BDD : Bouton submit inactif

Fermé
michgoarin Messages postés 10 Date d'inscription vendredi 2 mai 2008 Statut Membre Dernière intervention 8 décembre 2015 - Modifié par jordane45 le 8/12/2015 à 01:51
michgoarin Messages postés 10 Date d'inscription vendredi 2 mai 2008 Statut Membre Dernière intervention 8 décembre 2015 - 8 déc. 2015 à 20:23
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.
A voir également:

2 réponses

Pitet Messages postés 2826 Date d'inscription lundi 11 février 2013 Statut Membre Dernière intervention 21 juillet 2022 525
Modifié par Pitet le 8/12/2015 à 14:12
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
michgoarin Messages postés 10 Date d'inscription vendredi 2 mai 2008 Statut Membre Dernière intervention 8 décembre 2015
Modifié par michgoarin le 8/12/2015 à 20:24
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