pluging jquery pour validation de champs obligatoires

**Amelie MOREAU** · 08/03/2013, 11h55

Bonjour,

Dans mon formulaire, j'ai des champs obligatoires. Je voulais faire ça en Jquery, alors j'ai suivi cet exemple http://chez-syl.fr/jquery-plugin-desoform/.

à l'exécution, ma page html m'envoie vers "page.html" même si un champs n'est pas remplis; donc sans aucune vérification, sans aucun effet javascript.

je début en jquery, et je ne comprend pas d'où ça vient cette erreur.

aucune idée svp?

**SpaceFrog** · 08/03/2013, 11h59

Sans voir l'implémentation dans ton code ???
Nous ne sommes ni extralucides ni devins pour la plupart d'entre nous ...

**Amelie MOREAU** · 08/03/2013, 12h39

Voici mon code:

page Php contenant le formulaire "formulaire.php":

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Formulaire parcours</title>
 
<link rel="stylesheet" type="text/css" href="css/jquery.desoform.min.css" />
<link rel="stylesheet" type="text/css" href="css/buttons.min.css" />
 
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.desoform.min.js"></script>
<script type="text/javascript">
 
$(document).ready(function() {
 $('#monForm').desoForm({
 'emptyField': 'Le champ est obligatoire',
 'submit': function($el, ok) {
 if(ok) {
 alert($el.selector + ' prêt à être envoyé avec $el[0].submit(); !');
 //$el[0].submit();
 } else {
 alert('Erreur(s)');
 }
 }
 });
 
 $('#sauve').on('click', function() {
 $('#monForm').trigger('submit');
 return false;
 });
 
 $('#monForm input[type="text"]').each(function() {
 var $this = $(this);
 var required = $this.data('required');
 var regexp = $this.data('regexp');
 var error = $this.data('error');
 
 $(this).parent('.element').append('<label>&nbsp;</label> data-regexp="'+ regexp +'" data-required="' +required +'" data-error="' +error +'"');
 });
 
}); 
 
</script>
 
<!-- <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> -->
 
</head>
 
<body>
 
<form action="page_msg.html" method="post" id="monForm">
        <label>Date : </label>
        <input type="text" name="date" data-regexp="date" data-error="Format date (jj/mm/aaaa)" />
    <hr />
        <label>Date SQL : </label>
        <input type="text" name="datesql" data-regexp="date-en" data-required="true" data-error="Format date SQL (aaaa-mm-jj)" />
    <hr />
        <label>Courriel : </label>
        <input type="text" name="mail" data-regexp="email" data-error="Format email" />
    <hr />
        <label>Code postal : </label>
        <input type="text" name="cp" data-regexp="cp" data-required="false" data-error="Format code postal" />
    <hr />
        <label>Prénom : </label>
        <input type="text" name="prenom" data-regexp="^[a-zA-Z]{2,10}$" data-error="Test de la regexp ^[a-zA-Z]{2,10}$" />
    <hr />
        <input type="submit" value="Valider" />
</form>
 
</body>
</html>

ce que j'ai remarqué en utilisant le pluging "firebug" c'est que à l'exécution, une line s'ajoute entre les balises <head> de mon fichier "formulaire.php" qui est:
<script type="text/javascript" src="../lib/jquery-1.9.0.js"></script>

je ne sais pas d'où ça vient, et s'elle a un effet sur mon code!!

**Amelie MOREAU** · 08/03/2013, 15h01

yaaaaaaaaaaaaaaaaaaaai ^^

j'ai réglé le problème. j'adore Firebug. Je me demandais si la ligne ajoutée a l'exécution et que j'ai pu voir grâce à firebug avait un effet sur mon code, eh bien oui.

le navigateur ajoute un chemin dans ma page "formulaire.php" pour charger on line le fichier jquery-1.9.0.js. Mais il ne le trouve pas à l'exécution.
Donc, j'ai télécharger le fichier moi même et l'ai mise dans mon dossier "js", et ça maaaaaaaarche

pluging jquery pour validation de champs obligatoires

jQuery

Vue hybride

Discussions similaires

Partager

Partager