Sujet Précédent Sujet Suivant

Remplir input text suivant un autre avec requete sql et en ajax

Fermé
laguich49 Messages postés 1 Date d'inscription mercredi 26 août 2015 Statut Membre Dernière intervention 26 août 2015 - 26 août 2015 à 13:15
 ngolo - 26 août 2015 à 21:31
Bonsoir à tous,
Après pas mal de temps à chercher comment faire, je me lance à vous en faire la demande.

Je m'explique.

Suivant ce fourmulaire, avec saisi de la reference, la designation s'inscrit en automatique. Je voudrais, maintenant que suivant la base selectionnée (ici gennes) , et donc suivant la référence de l'article, cela aille chercher dans une table, le casier correspondant.

le html (oui je sais il reste à faire )
voici le code : 
<!DOCTYPE html> 
	<head >
		<title>Commande aux bases</title>
		<meta charset="UTF-8">
<meta name="description" content="commande mail des bases">
<meta name="keywords" content="HTML,CSS,XML,JavaScript">
<meta name="author" content="jerome" >
<link href="style.css" rel="stylesheet" media="all" type="text/css"> 
		<script type="text/javascript" src="http://code.jquery.com/jquery-1.5.1.min.js"></script>
		<script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery.ui/1.8.10/jquery-ui.js"></script>
		<script type="text/javascript">
			var cache = {};
			$(function ()
			{
				$("#ref, #desi").autocomplete({
					source: function (request, response)
					{
						//Si la réponse est dans le cache
						if (('FR' + '-' + request.term) in cache)
						{
							response($.map(cache['FR' + '-' + request.term], function (item)
							{
 
								return {
									label: item.reference + ", " + item.designation,
									value: function ()
									{
										if ($(this).attr('id') == 'ref')
										{
											$('#desi').val(item.designation);
											return item.reference;
										}
										else
										{
											$('#ref').val(item.reference);
											return item.designation;
										}
									}
								}
							}));
						}
						//Sinon -> Requete Ajax
						else
						{
							var objData = {};
							if ($(this.element).attr('id') == 'ref')
							{
								objData = { reference: request.term, pays: 'FR', maxRows: 10 };
							}
							else
							{
								objData = { designation: request.term, pays: 'FR', maxRows: 10 };
							}
							$.ajax({
								url: "./AutoCompletion.php",
								dataType: "json",
								data: objData,
								type: 'POST',
								success: function (data)
								{
									//Ajout de reponse dans le cache
									cache[('FR' + '-' + request.term)] = data;
									response($.map(data, function (item)
									{
 
										return {
											label: item.reference + ", " + item.designation,
											value: function ()
											{
												if ($(this).attr('id') == 'ref')
												{
													$('#desi').val(item.designation);
													return item.reference;
												}
												else
												{
													$('#ref').val(item.reference);
													return item.designation;
												}
											}
										}
									}));
								}
							});
						}
					},
					minLength: 3,
					delay: 600
				});
			});
		</script>
 
 
 
 
 
		<link rel="Stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/themes/base/jquery-ui.css" />
	</head>
	<body>
	</br>
	</br>
	<div id="conteneur">
		<form action="#">
		<div id="left"><fieldset>
 <legend> A QUI? : </legend>
   <p>Sélectioner la base qui dispose de la(des) pièce(s)) : </p>
		 <select name="choixbase">
<option value="gennes">Gennes</option>
<option value="cherre">Cherre</option>
<option value="varades">Varades</option>
<option value="abbaretz">Abbaretz</option>
<option value="Challain">Challain</option>
<option value="Noyen">Noyen</option>
<option value="Juille">Juille</option>
<option value="Bouloire">Bouloire</option>
<option value="Vautorte">Vautorte</option>
<option value="Peuton">Peuton</option>
<option value="Courcité">Courcite</option>
<option value="Vaiges">Vaiges</option>
<option value="Serigny">Serigny</option>
</select>
		</fieldset>
<fieldset>
 <legend> QUOI? : </legend>	
				<h3>Référence :</h3><input type="text" id="ref" size="25"/>	
 			<h3>Désignation : </h3><input type="text" id="desi" size="40" />	
			</fieldset></div><div id="right">
			<fieldset>
 <legend> quantité et ou? : </legend>
			<h3>Qté: </h3><input type="text" id="qte" size="6" />
			<h3>Casier: </h3><input type="text" id="casier" size="6" /></fieldset>
			<fieldset>
 <legend> demande de et pour? : </legend>
			<h3>De: </h3><input type="text" id="de" size="6" />
			<h3>Attribution: </h3><input type="text" id="pour" size="6" /></fieldset></div>
		</form>
		</div>
	</body>
</html>

Le php : 
<?php
require_once('./AutoCompletionCPVille.class.php');
 
//Initialisation de la liste
$list = array();
 
//Connexion MySQL
try
{
    $db = new PDO('mysql:host=localhost;dbname=********', 'root', '*******');
}
catch (Exception $ex)
{
    echo $ex->getMessage();
}
 
//Construction de la requete
$strQuery = "SELECT ref reference, desi designation FROM source WHERE ";
if (isset($_POST["reference"]))
{
    $strQuery .= "ref LIKE :reference ";
}
else
{
    $strQuery .= "desi LIKE :designation ";
}
//$strQuery .= "AND CODEPAYS = 'FR' ";
//Limite
if (isset($_POST["maxRows"]))
{
    $strQuery .= "LIMIT 0, :maxRows";
}
$query = $db->prepare($strQuery);
if (isset($_POST["reference"]))
{
    $value = $_POST["reference"]."%";
    $query->bindParam(":reference", $value, PDO::PARAM_STR);
}
else
{
    $value = $_POST["designation"]."%";
    $query->bindParam(":designation", $value, PDO::PARAM_STR);
}
//Limite
if (isset($_POST["maxRows"]))
{
    $valueRows = intval($_POST["maxRows"]);
    $query->bindParam(":maxRows", $valueRows, PDO::PARAM_INT);
}
 
$query->execute();
 
$list = $query->fetchAll(PDO::FETCH_CLASS, "AutoCompletionCPVille");;
 
echo json_encode($list);
?>

la table de la base Gennes est sur ce style : id aticle et casier.

Merci d'avance pour votre aide. Enfin si vous m'avez bien compris.

1 réponse

Réponse 1 / 1
ngolo
Modifié par ngolo le 26/08/2015 à 21:33
Bonsoir,

je peux vous conseiller de mettre la liste de vos bases en dynamiques ainsi que de stocker celle ci dans la base. Si vous devez ajouter une(ou plusieurs) 'catégorie' à votre sélection de 'base' ou en supprimer/modifier cela sera un horreur à faire puisqu'il faudra modifier tout le html, plutôt impensable si vos données interviennent dans une autre page, si l'entreprise veut rajouter une nouvelle liste après avoir agrandit ses activités(si ces noms de villes il faudra refaire tout le programme pour rajouter un pays avec votre façon de faire).
En terme d'analyse et modélisation de vos tables(Merise) c'est faux puisque Gennes, varades etc... sont bien une seule donnée qui doit être comprise dans votre système et que celle ci doit être regroupée soit dans l'entité comprenant 'casier'(même table) ou plutôt dans notre cas par une jointure(clé étrangère) puisque une catégorie 'base' peut avoir plusieurs 'casiers' différents.

Pour Ajax avec JQuery je ne suis pas expert, il s'agirais je pense de charger toutes les tables pouvant intervenir dès l'affichage de la page dans un fichier de métadonnées XML(le x de AJAX) pour y accéder lors de l'événement onchange du <select>(la partie asynchrone le 1er A de AJAX) et ça me sembles manquer.

En espérant vous orienter vers une analyse/conception plus rigoureuse car celle de la base de données/SI à pour buts:
>de simplifier le code écriture/lecture
>d'éviter les problèmes de lenteurs et risques d'erreurs
>de permettre que le programme soit robuste et fonctionnel en évitant que celui ci soit si complexe à utiliser que l'outil informatique devient une contrainte
>de pérenniser celui ci dans le temps en permettant l'évolution et la mise à jour de celui ci en garantissant l'intégrité des données

L'erreur que vous avez commise risque d'entraîner des difficultés dans 3 points sur les 4 présentés(dont le dernier qui en contient 2 en fait).

En espérant vous aider cordialement, Ngolo.
0

Discussions similaires

code couleur associé a une image
magic charly -
pandora -

9 réponses
problème avec graphQL
dancris11 -
hachel58 -

50 réponses
Trouver le mot réellement écrit en lettres capitales PIX
ETHAN -
kirikou -

4 réponses
La requête GraphQL n’est pas autorisée
Mansour -
jaccou -

17 réponses
input signal out of range
marlene -
usman000 -

14 réponses