controles de formulaire php et js , principe général ?
Bonjour,
J'espère être dans le bon forum...
J'ai cru comprendre que les contrôles de formulaires devaient s'effectuer coté serveur (php dans mon cas) pour la sécurité, et eventuellement coté client (js pour moi) pour le coté convivial de l'application et pour effectuer un contrôle avant d'envoyer les données au php de traitement.
J'ai donc écrit les contrôles à la fois en js et en php.
Par exemple, pour vérifier que les champs obligatoires ont bien été saisis, ça donne :
Formulaire HTML (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
| <form id="frmSaisie" >
<!-- #################### ARTICLE ############ -->
<fieldset name="article">
<legend>Identification de l'article</legend>
<label for="titre">Titre*</label><br />
<input type="text" id="titre" name="titre" required>
<br />
<label for="sstitre">Sous-titre</label><br />
<input type="text" id="sstitre" name="sstitre" >
<br />
<label for="parution">N° de parution*</label><br />
<select id="parution" name="parution" required>
<option value="">Sélectionnez une date de parution</option>
<?php foreach($parution as $idParution =>$parution): ?>
<option value="<?php echo $idParution; ?>"><?php echo "N°".$idParution." | ".$parution; ?></option>
<?php endforeach; ?>
</select>
<br />
<label for="page">Page*</label><br />
<input type="text" id="page" name="page" maxlength="3" required>
<br />
</fieldset>
<!-- #################### AUTEUR ############ -->
<fieldset name="auteur">
<legend>Auteur(e-s) de l'article</legend>
<label for="nomAuteur">Nom*</label><br />
<select id="nomAuteur" name="nomAuteur" onchange="majListAuteur();">
<option value="">Choisissez un nom</option>
<?php foreach($nomAuteur as $idNomAuteur =>$nomAuteur): ?>
<option value="<?php echo $idNomAuteur; ?>"><?php echo $nomAuteur; ?></option>
<?php endforeach; ?>
</select>
<br />
<label for="prenomAuteur">Prénom (ou détail)*</label><br />
<select id="prenomAuteur" name="prenomAuteur" required onchange="saisirAuteur();">
<option value="">Sélectionnez un nom ci-dessus</option>
</select>
<br />
</fieldset>
<!-- #################### THEME ############ -->
<fieldset name="theme">
<legend>Thème(s) de l'article</legend>
<label for="themeGen">Thème général*</label><br />
<select id="themeGen" name="themeGen" onchange="majListTheme();">
<option value="">Choisissez un thème général</option>
<?php foreach($surTheme as $id_sur_theme =>$surTheme): ?>
<option value="<?php echo $id_sur_theme; ?>"><?php echo $surTheme; ?></option>
<?php endforeach; ?>
</select>
<br />
<label for="themeDet">Thème détaillé*</label><br />
<select id="themeDet" name="themeDet" required onchange="saisirTheme();" >
<option value="">Sélectionnez un thème général ci-dessus</option>
</select>
<br />
</fieldset>
<!-- #################### PERSONNALITES ############ -->
<fieldset name="personnalité">
<legend>Personnalité(s) évoquée(s) dans l'article</legend>
<label for="nomPerson">Nom</label><br />
<select id="nomPerson" name="nomPerson" onchange="majListPerson();">
<option value="">Choisissez un nom</option>
<?php foreach($nomPerson as $idNomPerson =>$nomPerson): ?>
<option value="<?php echo $idNomPerson; ?>"><?php echo $nomPerson; ?></option>
<?php endforeach; ?>
</select>
<br />
<label for="prenomPerson">Prénom (ou détail)</label><br />
<select id="prenomPerson" name="prenomPerson" onchange="saisirPerson();">
<option value="">Sélectionnez un nom ci-dessus</option>
</select>
<br />
</fieldset>
<!-- #################### Valider ############ -->
<input type="button" value="Envoyer" id="envoyer" name="envoyer" onclick="envoi();"><br /><!--on click confirm tout + post InSert tout-->
</form> |
Contrôle JS + requete ajax d'envoi des données (functions.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
| function envoi () {
....
if (!Titre || !ParutionID || !Page || !Auteurs.length || !Themes.length || (!Persons.length && ( ($.inArray("65", ThemesID) !== (-1)) || ($.inArray("98", ThemesID) !== (-1))) ))
{
if (!Titre) { msgTitre = '\n - titre'; }
if (!ParutionID) { msgParution = '\n - n° de parution'; }
if (!Page) { msgPage = '\n - n° de page'; }
if (!Auteurs.length) {msgAuteur = '\n - auteur'; }
if (!Themes.length) {msgTheme = '\n - thème'; }
if (!Persons.length && ( ($.inArray("65", ThemesID) !== (-1)) || ($.inArray("98", ThemesID) !== (-1)) ))
{
msgPerson = '\n - personnalité';
console.log(msgPerson);
}
msgChamps = 'Veuillez renseigner les champs suivants : ' + msgTitre + msgParution + msgPage + msgAuteur + msgTheme + msgPerson;
alert (msgChamps);
return;
}
....
$.ajax(
{
type:'POST',
url:'http://localhost/saisie-article/ajout-article.php',
data: {titre:Titre, sstitre:Sstitre, parution:ParutionID, page:Page, bis:BisId, auteurs:Auteurs, themes:Themes, persons:Persons},
datatype: 'txt',
cache: false,
success: function (retourSql) {
if (retourSql)
{
console.log(retourSql);
alert(retourSql);
}
initPage();
}
}) |
Traitement php (ajout-article.php)
Code:
1
2
3
4
5
6
7
8
9
10
11
12
| ...
if ( !$titre || !$parution || !$page || !$auteurs || !$themes || (!$persons && (in_array(65, $themes)) || (in_array(98, $themes)) ))
{
if (!$titre) {$message[] = "\n - titre";}
if (!$parution) {$message[] = "\n - n° de parution";}
if (!$page) {$message[] = "\n - n° de page";}
if (!$auteurs) {$message[] = "\n - auteur";}
if (!$themes) {$message[] = "\n - thème";}
if (!$persons && (in_array(65, $themes)) || (in_array(98, $themes))) {$message[] = "\n - personnalité";}
exit ($db_erreur."\n Veuillez saisir les champs suivants : ".implode($message) );
}
... |
Or, mais j'ai lu ceci :
"le contrôle AJAX permet d'utiliser les fonctions de contrôle en PHP donc de ne pas écrire le code en JS et en PHP."
ou encore
"En utilisant ajax tu peux utiliser deux fois les mêmes contrôles coté serveur :
1) à la saisie du formulaire pour le confort
2) à la soumission du formulaire pour la sécurité."
Faut-il comprendre que grâce à ajax, le même code de validation php d'un formulaire peut servir à la fois côté client et coté serveur ?
Et donc que j'ai écrit deux fois ce qui aurait pu n'être écrit qu'une fois?
Et donc, comment aurait-il fallu faire?
Ou alors, est-ce que je n'ai rien compris ? :aie:
Et je me pose aussi la question de la pertinence du required de mes champs de formulaire...
Merci de vos éclaircissements !
