[AJAX] Insertion de données (formulaire) dans une base Access : ASP JavaScript
Salut,
J'ai récemment appris les langage ASP et Javascript et je cherche à entrer des informations saisies par formulaire dans une base de données Access...
Je me suis pas mal promener sur le web mais je dois avouer que je frole l'overdose d' "incompréhension générale" vue que je commence à m'emmeler les méninges dans tous les sens.
Mon problème est donc le suivant :
fichier "ajouter_deplacement.ASP"
1 champ text de saisie - 1 <div> contenant une référence "txtHint"
1 boutton "Valider" avec un onClick -> function ValidForm
ValiForm :
1- Vérification que le champ text est non vide
2- Vérification du BROWSER
3- Envoi d'une requete au serveur (Je n'ai pas trop compris à quoi corresponde les paramètres : RequestHeader et ce que je vasi envoyer au serveur avec Send)
4- Controle du State
5- Envoi
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
| <html>
<head>
<title>Acquisition de donnees </title>
<link rel="stylesheet" type="text/css" href="style2.css" />
</head>
<body>
<div id="content">
<form name="form_deplacement" action="" method="post">
<div class="AttachedForm"> Ajout d'un deplacement dans la base de donnees </div>
<div class="PositionForm">
<table>
<tr>
<td class="LabelForm"> <label for="nom_deplacement">Type de deplacement</label>: </td>
<td class="TextForm"> <input type="text" id="nom_deplacement" name="nom_deplacement"/></td>
<td class="AdviceForm"><div id="txtHint"></div></td>
</tr>
</table>
</div>
<div>
<input type="button" value="Valider" onClick="ValidForm(this.form_deplacement)"/>
<input type="reset" value="Retablir"/>
</div>
</form>
<script type="text/javascript">
// Fonction d'insertion des données dans la base données
function ValidForm(form){
if (form.length==0){
document.getElementById("txtHint").innerHTML="Champ Obligatoire !";
return;
}
else{
xmlHttp=GetXmlHttpObject();
xmlHttp.open("post","/RequestASP.asp",true);
xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
xmlHttp.onreadystatechange = stateChanged;
xmlHttp.send("nom_deplacement="getElementById("nom_deplacement"));
}
}
// Fonction de test du BROWSER
function GetXmlHttpObject() {
var xmlHttp = null;
try {
xmlHttp = new XMLHttpRequest(); } // Firefox, Opera 8.0+, Safari
catch (e) {
try {
xmlHttp = new ActiveXObject("Msxml2.XMLHTTP"); } // Internet Explorer 6.0+
catch (e) {
try {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); } // Internet Explorer 5.5+
catch (e) {
alert("Votre Explorateur Internet ne supporte pas la technologie AJAX !"); }
}
}
return xmlHttp;
}
// Fonction de test du transfert des données au serveur
function stateChanged() {
if (xmlHttp.readyState==4 && xmlHttp.status == 200) {
document.getElementById("txtHint").innerHTML = xmlHttp.responseText;
}
}
</script>
</div>
</body>
</html> |
fichier "Request.ASP"
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
|
<%@LANGUAGE="VBSCRIPT" CODEPAGE="1252"%>
<%option explicit %>
<%
Dim g_oConn
Dim g_oRs
Dim TempId
Dim frm = Request.form
Connect
InsertData(Request.form)
if TempId
Disconnect
Sub Connect
Set g_oConn = Server.CreateObject("ADODB.Connection")
g_oConn.ConnectionString = "Driver={Microsoft Access Driver (*.mdb)}; DBQ= " & Server.MapPath("base_test.mdb") & ";"
On error resume next
g_oConn.Open
if g_oConn.State = 0 then
Response.Write "La connexion à la base """ & Server.MapPath("base_test.mdb") & """ a échoué <br/>"
Response.End
End if
On error goto 0
End Sub
Sub Disconnect
If g_oConn.State = 1 then g_oConn.Close
Set g_oConn = Nothing
End Sub
Sub InsertData(frm)
Dim sql
Set g_oRs = Server.CreateObject("ADODB.Recordset")
sql = "INSERT INTO deplacements (nom_deplacement) VALUES ('" & frm("nom_deplacement") & "');"
g_oRs.Open sql, g_oConn, 3, 3
response.write("Le deplacement a été ajouté à la base !")
End Sub
Sub AfficheForm
%> |
Si une ame charitable pouvait m'aider (en compréhension : lien vers explications / en programmation)...
Merci
Appel de fonction javascript impossible !?!?!
Salut,
Tout d'abord, un grand merci à tous ceux qui jusqu'à lors se sont penchés sur mon problème :aie: !
Un petit récapitulatif : L'objectif est de remplir un formulaire contenu dans une page "ajouter_deplacement.asp", à la validation d'un <input> de type "button" et via une commande "onclick", une fonction de validation du formulaire est appellée. Celle-ci est contenu dans un fichier "test.js".
Dans un 1er temps, cette fonction test si le champ "text" est rempli et renvoye un message d'erreur via une cible nommée "txtHint" s'il ne l'est pas.
Dans un 2nd temps, cette fonction fait appel à une fonction permettant de tester le "BROWSER" de l'utilisateur puis envoye une requête au serveur de type "POST". Execution du code asp contenu dans le fichier "Request.asp" chargé d'insérer le contenu du champ "txt" dans une base de données.
Le problème survient lors de l'appel de la fonction de validation du formulaire "ValidForm(this.form)". Une commande "alert" a été rajoutée dans la fonction ValidForm (fichier "test.js") avant toutes condition mais ce message ne s'affiche pas !!!! 8O
Une commande javascript dans la page "ajouter_deplacement.asp" s'effectue parfaitement !!
Le doctype de cette même page est de type transitionnal pour XHTML 1.0 !!
Aucun message d'erreur ne s'affiche, seulement aucune execution de la fonction !!
Il n'y a pas de doctype dans les fichiers "test.js" et "RequestASP.asp" (faut-il en mettre ?)
Quelqu'un pourrait-il m'aider à résoudre ce problème d'appel de la fonction "ValidForm" ? Si queuqu'un arrivait à faire fonctionner le lein entre les fichiers "ajouter_deplacement.asp" et "test.js" chez lui, je serais rassuré !! Je ne comprend pas d'où vient l'erreur !
Merci d'avance pour la lecture de ce post tout à fait indigeste !! :aie:
fichier "ajouter_deplacement.asp" :
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
| <?xml version="1.0" encoding="utf-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Acquisition de données </title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<link rel="stylesheet" type="text/css" href="style2.css" />
<script src="test.js" type="text/javascript">
</script>
</head>
<body>
<div id="content">
<form name="form" action="" method="post">
<div class="AttachedForm"> Ajout d'un déplacement dans la base de données </div>
<div class="PositionForm">
<table>
<tr>
<td class="LabelForm"> <label for="nom_deplacement">Type de déplacement</label>: </td>
<td class="TextForm"> <input type="text" id="nom_deplacement" name="nom_deplacement"/> </td>
<td class="AdviceForm"> <div id="txtHint"></div> </td>
</tr>
</table>
</div>
<div>
<input type="button" value="Valider" onclick="ValidForm(this.form)"/>
<input type="reset" value="Rétablir"/>
<script type="text/javascript">
<!--
alert("test");
//-->
</script>
</div>
</form>
</div>
</body>
</html> |
fichier "test.js"
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
|
// Fonction d'insertion des données dans la base données
function ValidForm(form) {
alert('Ca marche enfin !');
if (document.getElementById('nom_deplacement').value == "") {
document.getElementById('txtHint').innerHTML='Ce champ est obligatoire !';
return false;
}
//return true;
else {
var xhr = GetXmlHttpObject();
xhr.open('post','RequestASP.asp',true);
xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
xhr.onreadystatechange = stateChanged;
xhr.send('nom_deplacement='getElementById('nom_deplacement').value);
}
}
// Fonction de test du BROWSER
function GetXmlHttpObject() {
var xhr = null;
try {
xhr = new XMLHttpRequest(); } // Firefox, Opera 8.0+, Safari
catch (e) {
try {
xhr = new ActiveXObject('Msxml2.XMLHTTP'); } // Internet Explorer 6.0+
catch (e) {
try {
xhr = new ActiveXObject('Microsoft.XMLHTTP'); } // Internet Explorer 5.5+
catch (e) {
alert('Votre Explorateur Internet ne supporte pas la technologie AJAX !'); }
}
}
return xhr;
}
// Fonction de test du transfert des données au serveur
function stateChanged() {
if (xhr.readyState==4 && xhr.status == 200) {
document.getElementById('txtHint').innerHTML = xhr.responseText;
}
} |
fichier "RequestASP.asp" :
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
| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<%@LANGUAGE="VBSCRIPT" CODEPAGE="1252"%>
<%option explicit %>
<%
' Regénération de la page (empêche l'utilisation du cache serveur)
response.expires = -1
response.AddHeader "Pragma", "no-cache"
response.AddHeader "cache-control", "no-store"
Dim g_oConn
Dim g_oRs
Dim TempId
Dim frm = Request.form
Connect
InsertData(Request.form)
Disconnect
Sub Connect
Set g_oConn = Server.CreateObject("ADODB.Connection")
g_oConn.ConnectionString = "Driver={Microsoft Access Driver (*.mdb)}; DBQ= " & Server.MapPath("base_test.mdb") & ";"
On error resume next
g_oConn.Open
if g_oConn.State = 0 then
Response.Write "La connexion à la base """ & Server.MapPath("base_test.mdb") & """ a échoué <br/>"
Response.End
End if
On error goto 0
End Sub
Sub Disconnect
If g_oConn.State = 1 then g_oConn.Close
Set g_oConn = Nothing
End Sub
Sub InsertData(frm)
Dim sql
Set g_oRs = Server.CreateObject("ADODB.Recordset")
sql = "INSERT INTO deplacements (nom_deplacement) VALUES ('" & frm("nom_deplacement") & "');"
g_oRs.Open sql, g_oConn, 3, 3
response.write("Le deplacement a été ajouté à la base !")
End Sub
Sub AfficheForm
%> |
