[SRC] Envoyer un formulaire avec Ajax
Suite à une question qui m'a été posée sur le chat, j'en profite pour déposer ici un petit script qui permet d'envoyer les saisies d'un form avec ajax sans rechargement de page ...
Le script scanne les éléments du form afin de concaténer la chaine de paramètres qui sera ensuite passé en send ...
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
|
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Ajax Form</title>
<script type='text/javascript'>
function SendAjaxForm(){
var Params=""
var i=0;
var Elt;
while (Elt=document.forms['myform'].elements[i] ){
if(Elt.value && Elt.type!='submit'){Params+="&"+Elt.name+"="+Elt.value;}
i++;
}
Params=Params.replace(/^&/,"")
// alert(Params)
//l'ajax
if (window.XMLHttpRequest) {
xhr = new XMLHttpRequest();
}
else if (window.ActiveXObject) {
xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
xhr.open('POST',' pagecible.php', true);
xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
xhr.send(Params);
xhr.onreadystatechange = function() {
if (xhr.readyState == 4) {
if (xhr.status == 200) {
//ici le traitment du retur ajax
}
else{ alert ("Erreur : " + xhr.status) };
}
}
}
</script>
</head>
<body>
<form name="myform" method="submit" action="javascript:SendAjaxForm()">
<input type='text' name="text1" />
<input type='text' name="text1" />
<input type='text' name="text1" />
<input type='text' name="text2" />
<input type='text' name="text2" />
<input type='text' name="text2" />
<select name='sel'>
<option value='one'>un</option>
<option value='two'>deux</option>
<option value='three'>trois</option>
<option value='four'>quatre</option>
</select>
<input type='submit' value="go" />
</form>
</body>
</html> |
