[AJAX] Rafraîchissement d'1 formulaire
bonjour,
mon problème est que je veux modifier les donnes d'un stage que j'ai entré dans ma base donc j'ai un formulaire de modification qui contient l'identifiant de stage et les champs pour des donnees de ce stage .ce que je veux c'est que quand je rempli le champ identifiant de stage les autres champs (tels que mission stage, encadreur....)seront affichés dés que je quitte le focus de champ identifiant ces champs contiennent les anciens donnees de ce stage que je vais les modifier sur le champ et les enregistrer.je sais que ça en ajax mais mon prableme c'est que je ne sais pas quoi choisir dans le formulaire pour l'identifiant de stage"onchange=mostage()"ou"onfocus=mostage()"
//mostage est la fonction ajax
voici le code:
<?php
print' <title>modification de stage </title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript" type="text/JavaScript">
function mostage() {
var l1 = modif_stage.elements["m1"];
var t1 = modif_stage.elements["m2"];
var t2 = modif_stage.elements["m3"];
var t3 = modif_stage.elements["m4"];
var t4 = modif_stage.elements["m5"];
var t5 = modif_stage.elements["m6"];
var t6 = modif_stage.elements["m7"];
var t7 = modif_stage.elements["m8"];
var t8 = modif_stage.elements["m9"];
var index = l1.selectedIndex;
var filename = "modification.php?type_ad="+escape(l1.options[index].value);
if(index < 1)
{
m2.options.length = 0;
m3.options.length = 0;
m4.options.length = 0;
m5.options.length = 0;
m6.options.length = 0;
m7.options.length = 0;
m8.options.length = 0;
m9.options.length = 0;
}
else
{
var xhr_object = null;
if(window.XMLHttpRequest) // Firefox
xhr_object = new XMLHttpRequest();
else if(window.ActiveXObject) // Internet Explorer
xhr_object = new ActiveXObject("Microsoft.XMLHTTP");
else { // XMLHttpRequest non supporté par le navigateur
alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest...");
return;
}
xhr_object.open("GET", filename, false);
xhr_object.onreadystatechange = function() {
if(xhr_object.readyState == 4)
{
//alert(xhr_object.responseText);
var elem=xhr_object.responseText;
var tab=elem.split(",");
//alert(tab);
modif_stage.elements["m2"]; .value = tab[0];
modif_stage.elements["m3"]; .value = tab[1];
modif_stage.elements["m4"]; .value = tab[2];
modif_stage.elements["m5"]; .value = tab[3];
modif_stage.elements["m6"]; .value = tab[4];
modif_stage.elements["m7"]; .value = tab[5];
modif_stage.elements["m8"]; .value = tab[6];
modif_stage.elements["m9"]; .value = tab[7];
}
}
}
xhr_object.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhr_object.send(filename);
}
</script>
<table width="308" height="32" border="1" align="center" bordercolor="#336699" >
<tr><td width="308" height="32">
<p align="center">
<font color="#C71585" face="Lucida Handwriting" size="5">Modification stage</font>
</td>
</tr>
</table>
<form name="modif" action="modif_stage.php" method="post">
<table border="1" width="100%" height="100%" bordercolor="#336699" >
<tr>
<td width="60%" height="20%" >
<br><br>
<font face="Verdana" size="2">Identifiant de stage:</font><input type="text" name="m1" id="m1" onChange="mostage();"> <br> <br>
<br></td>
</tr>
<tr>
<td width="60%" height="20%" >
<br><br><br>
<font face="Verdana" size="2">Mission confiée au stagiaire:</font><br>
<b><TEXTAREA rows="5" name="m2">
Ecrire ici svp </TEXTAREA></b><br><br>
<font face="Verdana" size="2">Date du debut de stage:</font><input type="text" name="m3" id="m3"> <br> <br>
<font face="Verdana" size="2">Date de fin de stage:</font><input type="text" name="m4" id="m4"> <br> <br>
<font face="Verdana" size="2">Session de stage:</font><input type="text" name="m5" id="m5"> <br> <br>
<br><br><br> </td>
</tr>
<tr>
<td width="60%" height="20%" >
<br><br><br>
<font face="Verdana" size="2">Identifiant de l\'encadreur :</font><input type="text" name="m9" id="m9"> <br> <br>
<font face="Verdana" size="2">Nom encadreur :</font><input type="text" name="m6" id="m6"> <br> <br>
<font face="Verdana" size="2">Prenom encadreur :</font><input type="text" name="m7" id="m7"> <br> <br>
<font face="Verdana" size="2">Fonction:</font><input type="text" name="m8" id="m8"> <br> <br>
<br><br><br> </td>
</tr>
<tr align="center" valign="top">
<td>
<p align="center"><input type="submit" name="B1" class=button value="Enregistrer">
<input type="submit" class=button value="Annuler" name="B2"></p><BR><BR>
</td>
</tr>
</table>
</table>
</form>';
?>
ilya avec ce message la page"modif_stage.php" et le fichier"modification.php"
je ne suis pas sur de ma syntaxe ,si vous permettez de me corriger mes fautes ou au moins de me les signaler.
merci d'avance.
ajax pour rafraichissement
voici le code dont je doute s'il est correct syntaxiquement ou non:
<?php
print' <title>modification de stage </title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript" type="text/JavaScript">
function mostage() {
var l1 = modif_stage.elements["m1"];
var t1 = modif_stage.elements["m2"];
var t2 = modif_stage.elements["m3"];
var t3 = modif_stage.elements["m4"];
var t4 = modif_stage.elements["m5"];
var t5 = modif_stage.elements["m6"];
var t6 = modif_stage.elements["m7"];
var t7 = modif_stage.elements["m8"];
var t8 = modif_stage.elements["m9"];
var index = l1.selectedIndex;
var filename = "modification.php?type_ad="+escape(l1.options[index].value);
if(index < 1)
{
m2.options.length = 0;
m3.options.length = 0;
m4.options.length = 0;
m5.options.length = 0;
m6.options.length = 0;
m7.options.length = 0;
m8.options.length = 0;
m9.options.length = 0;
}
else
{
var xhr_object = null;
if(window.XMLHttpRequest) // Firefox
xhr_object = new XMLHttpRequest();
else if(window.ActiveXObject) // Internet Explorer
xhr_object = new ActiveXObject("Microsoft.XMLHTTP");
else { // XMLHttpRequest non supporté par le navigateur
alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest...");
return;
}
xhr_object.open("GET", filename, false);
xhr_object.onreadystatechange = function() {
if(xhr_object.readyState == 4)
{
//alert(xhr_object.responseText);
var elem=xhr_object.responseText;
var tab=elem.split(",");
//alert(tab);
modif_stage.elements["m2"]; .value = tab[0];
modif_stage.elements["m3"]; .value = tab[1];
modif_stage.elements["m4"]; .value = tab[2];
modif_stage.elements["m5"]; .value = tab[3];
modif_stage.elements["m6"]; .value = tab[4];
modif_stage.elements["m7"]; .value = tab[5];
modif_stage.elements["m8"]; .value = tab[6];
modif_stage.elements["m9"]; .value = tab[7];
}
}
}
xhr_object.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhr_object.send(filename);
}
</script>