Réaliser des champs de saisie obligatoires avec jQuery

**manelll** · 24/03/2015, 18h06

Bonjour , je viens de réaliser un formulaire et je veux que certain champs soit obligatoire pour cela j'ai utilisé le plugin jQuery.validity mais ça n'a pas marché c'est à dire lors du remplissage du formulaire quand je ne remplie pas les champs obligatoire le formulaire est envoyé sans problème

j'ai besoin d'aide pour résoudre mon problème ci-dessous le code source du formulaire s'il ya quelques choses qui n'est pas claire veuillez me le dire s'il vous plait

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
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
<?php
require('config.php');
mysql_query("SET NAMES utf8");
mysql_query("set characer set utf8");
?>
<!doctype html>
<html><head>
    <meta charset="utf-8">
    <title>enregistrement des données</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="">
 
    <!-- Le styles -->
    <link href="assets/css/bootstrap.css" rel="stylesheet">
    <link href="assets/css/main.css" rel="stylesheet">
    <link href="assets/css/font-style.css" rel="stylesheet">
    <link rel="stylesheet" href="assets/css/register.css">
 
 
 
    <style type="text/css">
      body {
        padding-top: 60px;
      }
    </style>
 
    <!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
    <!--[if lt IE 9]>
      <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
 
    <!-- Le fav and touch icons -->
    <link rel="shortcut icon" href="assets/ico/favicon.ico">
    <link rel="apple-touch-icon-precomposed" sizes="144x144" href="assets/ico/apple-touch-icon-144-precomposed.png">
    <link rel="apple-touch-icon-precomposed" sizes="114x114" href="assets/ico/apple-touch-icon-114-precomposed.png">
    <link rel="apple-touch-icon-precomposed" sizes="72x72" href="assets/ico/apple-touch-icon-72-precomposed.png">
    <link rel="apple-touch-icon-precomposed" href="assets/ico/apple-touch-icon-57-precomposed.png">
 
  	<!-- Google Fonts call. Font Used Open Sans & Raleway -->
	<link href="assets/css/css.css" rel="stylesheet" type="text/css">
 
	<script type="text/javascript" src="assets/js/jquery.js"></script>
<script type="text/javascript" src="assets/js/jquery.validate.js"></script>
 
 
 
	</head>
  <body style=" background-color: #1f1f1f; ">
 
  	<!-- NAVIGATION MENU -->
 
   <div class="navbar-nav navbar-inverse navbar-fixed-top">
        <div class="container">
 
          <div class="navbar-collapse collapse">
            <ul id="menu-deroulant" class="nav navbar-nav" style="margin-left: 400px;">
 
            <!--  <li><a href="manager.html"><i class="icon-folder-open icon-white"></i> File Manager</a></li>-->
              <li><a href="persoExemp.html"><i class="icon-calendar icon-white"></i>liste des personnes exempté</a></li>
              <li><a href="menuDisponibilite.html"><i class="icon-calendar icon-white"></i> listeDisponibilitéPersonne</a></li>
 
	   <li><a href="menu_exemption.html">lesExemption</a></li>
 
 
 
 
         <li class="active"><a href="#"><i class="icon-user icon-white"></i> les personnels</a>
 
		<ul>
			<li><a href="user.php">ajouterPersonne</a></li>
			<li><a href="del_perso.html">supprimerPersonne</a></li>
			<li><a href="menu_modif_user.html">modifierDonnéesDunepersonne</a></li>
			<li><a href="liste.html">listePersonne</a></li>
		</ul>
			  </li>
 
<li ><a href="index.html"><i class="icon-home icon-white"></i>acceuil</a></li>
            </ul>
          </div><!--/.nav-collapse -->
        </div>
    </div>
 
    <div class="container">
 
 
        	<div class="col-sm-6 col-lg-6">
        		<div id="register-wraper">
        		    <form  id="register-form" method="POST" class="form" action="add.php">
        		        <legend>donnéesPersonne</legend>
 
        		        <div class="body">
 
    		        		<label for="name">prénom*</label>
    		        		<input dir='rtl' id='name' name='name' class="input-huge" type="text" >
 
    		        		<label for="surname">nom*</label>
    		        		<input dir='rtl' id='surname' name='surname' class="input-huge" type="text" >
 
        		        	<label>grade</label>
        		        <div id='grade_select'>
 
								<?php
                                                                                echo '<select  size=1 name="grade" id="grade">'."\n";
                                                                                echo '<option value="-1">--listeGrade--</option>'."\n";
                                                                                $result = mysql_query("SELECT grade FROM grade" );
                                                                                while($data =  mysql_fetch_array($result))
                                                                                        {
                                                                                                echo '<option value="'.$data[0].'">'.$data['grade'];
                                                                                                echo '</option>'."\n";
                                                                                        }
                                                                                                echo '</select>'."\n";
                                                                                        
                                                        ?>	
 
							</div>
							<label >matricule</label>
    		        		<input dir='rtl' id='matricule' name='matricule' class="input-huge" type="text">
 
							 	<label>l'unité*</label>
        		        	<input name='unite' id='unite' dir='rtl'class="input-huge" type="text">
 
        		        	<label>numParUnité</label>
        		        	<input  name='num_unite' id='num_unite' dir='rtl'class="input-huge" type="text" >
 
								<label>numTajnid</label>
        		        	<input name='num_tajnid' id='num_tajnid' dir='rtl'class="input-huge" type="text">
 
									<label>	رقم السلاح</label>
        		        	<input name='num_arme'  id='num_arme' dir='rtl'class="input-huge" type="text">
									<label>		رقم الحربة</label>
        		        	<input name='num_dague' id='num_dague' dir='rtl'class="input-huge" type="text">
 
							   <label>typeSang *</label>
        		        	<input name='type_sang'  id='type_sang' dir='rtl'class="input-huge" type="text" >
								<label>adresse</label>
        		        	<input name='addresse'  id='addresse'  dir='rtl'class="input-huge" type="text">
							<label>téléphone</label>
        		        	<input name='telephone'  id='telephone' dir='rtl'class="input-huge" type="text">
 
							<label>typeExemption</label>
        		        <div id='exemp_select'>
 
								<?php
                                                                                echo '<select  size=1 name="exemption" id="exemption">'."\n";
                                                                                echo '<option value="-1">listeExemption--</option>'."\n";
                                                                                $result = mysql_query("SELECT nom_exemption FROM exemption" );
                                                                                while($data =  mysql_fetch_array($result))
                                                                                        {
                                                                                                echo '<option value="'.$data[0].'">'.$data['nom_exemption'];
                                                                                                echo '</option>'."\n";
                                                                                        }
                                                                                                echo '</select>'."\n";
                                                                                        
                                                        ?>	
 
							</div>
 
						<label>disponibilité</label>
        		        <div id='dispo_select'>
 
								<?php
                                                                                echo '<select  size=1 name="disponibilité" id="disponibilité">'."\n";
                                                                                echo '<option value="-1">--حالات التوفر الممكنة--</option>'."\n";
                                                                                $result = mysql_query("SELECT Etat_dispo FROM disponibilité" );
                                                                                while($data =  mysql_fetch_array($result))
                                                                                        {
                                                                                                echo '<option value="'.$data[0].'">'.$data['Etat_dispo'];
                                                                                                echo '</option>'."\n";
                                                                                        }
                                                                                                echo '</select>'."\n";
                                                                                        
                                                        ?>	
 
							</div>
 
                         </div>
 
 
 
        		        <div class="footer">
        		              <button type="submit" class="btn btn-success">valider</button>
        		        </div>
        		    </form>
 
        		</div>
        	</div>
 
        </div>
    </div>
<!-- le script destiné à la réalisation des champs obligatoire -->
	<script type="text/javascript" language="javascript">
$(window).load(function() {
	$("#register-form").validate(function() {
		$("#name").require("veuillez entrer le nom svp");
	});
});
</script>
	<div id="footerwrap">
      	<footer class="clearfix"></footer>
      	<div class="container">
      		<div class="row">
      			<div class="col-sm-12 col-lg-12">
      			<p><img src="assets/img/logo.png" alt=""></p>
      			<p>L.R. Mohamed Fadhel Benzarti</p>
      			</div>
 
      		</div><!-- /row -->
      	</div><!-- /container -->		
	</div><!-- /footerwrap -->
 
 
    <!-- Le javascript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
    <script src="assets/js/bootstrap.js"></script>
 
 
</body></html>

les lignes de code destinés à la réalisation des champs obligatoire sont les lignes 43 ET 44 et de la ligne 192 jusqu'à 197

**SpaceFrog** · 25/03/2015, 08h26

Fais une recherche avec "required" ...

**manelll** · 29/03/2015, 20h18

j'ai fait une recherche avec requiered ça marche mais le problème est que je voulais que le message d'avertissement soit afficher en un langage autre que le français où l'anglais

**Bovino** · 31/03/2015, 11h17

L'API HTML5 de contrainte de validation.

Réaliser des champs de saisie obligatoires avec jQuery

jQuery

Discussions similaires

Partager

Partager