[AJAX] Formulaire complet (2 liste lié + champs manuel + submit)
Bonjour !
J'ai effectuer tout un tas de recherche sur les forum ajax et javascript et je ne trouve pas de réponse à mon soucis ! Je connais très bien le php mais je commence tout juste avec ajax ... bref !
Mon soucis est la réalisation d'un formulaire de saisie complet, il contient 2 liste déroulante lié ainsi que plusieurs champs de saisie manuel ainsi qu'un bouton submit pour injection dans la bdd.
exemple de formulaire souhaité:
- les 2 listes sont Marque -> modele (mise à jour de modele en fonction de marque
- champs prix (saisie manuel)
- bouton submit (injection en bdd)
http://www.2place.net/exform.jpg
Pour faire simple , je veux faire le choix dans mes listes lié, remplir les autres champs et valider le tout par un bouton submit que je redirigerais vers ma page d'insertion php.
j'ai pour le moment le formulaire avec seulement les 2 listes lié il fonctionne correctement mais je ne sais pas comment intégrer mes autre champs manuel et comment et ou intégrer le bouton submit qui enverra les infos dans la bdd.
Je me suis basé sur ce script : http://perso.wareteam.com
mon code qui fonctionne seulement je comprend pas bien la partie POST "il parle d'une page valid.php mais quand me choix sont fait via mes 2 listes il ne charge pas la page ....
INDEX.PHP
Code:
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 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89
| <html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">
/**
* Permet d'envoyer des données en GET ou POST en utilisant les XmlHttpRequest
*/
function sendData(param, page)
{
if(document.all)
{
//Internet Explorer
var XhrObj = new ActiveXObject("Microsoft.XMLHTTP") ;
}//fin if
else
{
//Mozilla
var XhrObj = new XMLHttpRequest();
}//fin else
//définition de l'endroit d'affichage:
var content = document.getElementById("contenu");
XhrObj.open("POST", page);
//Ok pour la page cible
XhrObj.onreadystatechange = function()
{
if (XhrObj.readyState == 4 && XhrObj.status == 200)
content.innerHTML = XhrObj.responseText ;
}
XhrObj.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
XhrObj.send(param);
}//fin fonction SendData
</script>
</head>
<body>
<?php
// Paramètres de la Connexion à la base MYSQL
$user="****";
$host="****";
$password="****";
$database="****";
$i=0; // variable de test
$j=0; // variable pour garder la valeur du premier enregistrement catégorie pour l'affichage
$connexion = mysql_connect($host,$user,$password) or die ("Connexion au serveur impossible");
mysql_select_db($database,$connexion);
// Séléction de tous les enregistrements de la table Catégorie
$rq="Select * from marque order by marque;";
$result= mysql_query ($rq) or die ("Select impossible");
echo "<form method='POST' action='valid.php'>";?> <select size="1" name="cat" OnChange="sendData('id='+this.value,'liresc.php')" onKeyUp="sendData('id='+this.value,'liresc.php')">
<?php
while ($dt=mysql_fetch_row($result))
{
// Remplir la liste déroulante des catégorie
echo "<option value=".($dt[0]).">".($dt[1])."</option>";
if ($i==0) { $j=$dt[0]; $i=1; } // garder la valeur du premier enregistrement
}
?>
</select><br><br>
<div id="contenu">
<?php
// affichage des sous-catégorie appartenant à la première catégorie.
echo "<select size='1' name='souscat'>";
$rq="Select * from modele where id_marque=".$j." order by modele;";
$result= mysql_query ($rq) or die ("Select impossible");
// $i = initialise le variable i
$i=0;
while ($dt=mysql_fetch_row($result))
{
echo "<option value=".utf8_encode($dt[0]).">".utf8_encode($dt[1])."</option><br>";
}
echo "</select>";
?>
</div>
</form>
</body>
</html> |
LIRESC.PHP
Code:
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
| <?php
header('Content-type: text') ; // on déclare ce qui va être afficher
// test des POST emis
if(isset($_POST['id']) && !empty($_POST['id']) ){
$user="****";
$host="*****";
$password="****";
$database="*****";
$connexion = mysql_connect($host,$user,$password) or die ("Connexion au serveur impossible");
mysql_select_db($database,$connexion);
$rq="Select * from modele where id_marque=".$_POST['id']." order by modele;";
$result= mysql_query ($rq) or die ("Select impossible");
// $i = initialise le variable i
$i=0;
if (mysql_num_rows($result)>0)
{
echo "<select size='1' name='souscat'>";
}
else
{
echo utf8_encode("Pas de sous catégories disponible");
}
while ($dt=mysql_fetch_row($result))
{
echo "<option value=".utf8_encode($dt[0]).">".utf8_encode($dt[1])."</option><br>";
}
echo "</select>";
}
?> |
merci de votre aide