Ajout d'input dynamique dans formulaire

**manelll** · 04/06/2015, 13h25

Bonjour,
Je cherche à réaliser un formulaire dynamique dont l'utilisateur peut renseigner autant de services qu'il souhaite, j'ai entendu parler de jQuery mais j'ai pas trouvé le meilleur plugin à utiliser, est ce quelqu'un peut m'aider svp

**autran** · 04/06/2015, 16h04

manelll,

oui tous les langages "web" qui le rendent dynamique permettent de créer des formulaires dynamique. Après tu mets ce que tu veux dans tes formulaires (input bouton ....)

javascript est évidemment un langage qui dynamise tes pages web et jQuery est une librairie bien pratique en JavaScript. Mais ca n'est pas un plugin. en effet, si tu ecris des pages en javascript + jQuery, l'utilisateur visualises tes belles pages avec n'importe quel browser et n'aura rien installer. rien a voir avec flash qui lui nessecite un plugin.

**manelll** · 04/06/2015, 16h37

merci Kevinternet, en fait j'ai essayé avec le code que je vais poster ci-dessous, j'ai crée un formulaire avec un champs qui contient une liste déroulante liée à une base de données, je veux que ce champs soit dynamique mais avec le code que j'ai développé champs ajouté ne contiennent pas une liste déroulante est ce que vous pouvez m'aider à résoudre le problème, merci

Code php :

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
<?php 
 
	require 'database.php';
 
	$id = null;
	if ( !empty($_GET['id'])) {
		$id = $_REQUEST['id'];
	}
 
	if ( null==$id ) {
		header("Location: affectation.php");
	}
 
	if ( !empty($_POST)) {
		// keep track validation errors
		$nameError = null;
		$surnameError = null;
		$gradeError = null;
		$servicelogError = null;
 
		// keep track post values
 
		$name = $_POST['name'];
		$surname = $_POST['surname'];
		$grade = $_POST['grade'];
		$servicelog = $_POST['servicelog'];
 
		// validate input
		$valid = true;
		if (empty($name)) {
			$nameError = 'Please enter Name';
			$valid = false;
		}
 
		if (empty($surname)) {
			$surnameError = 'Please enter surname';
			$valid = false;
		}
 
		if (empty($grade)) {
			$gradeError = 'Please enter grade';
			$valid = false;
		}
 
		if (empty($servicelog)) {
			$servicelogError = 'Please enter servicelog';
			$valid = false;
		}
 
		// update data
		if ($valid) {
			$pdo = Database::connect();
			$pdo->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
			$sql = "UPDATE personnel  set name = ' ".$name." ', surname = ' ".$surname." ', grade = ' ".$grade." ', servicelog = ' ".$servicelog." '  WHERE id = $id";
			$q = $pdo->prepare($sql);
			$q->execute(array($name,$surname,$grade,$servicelog,$id));
			Database::disconnect();
			header("Location: affectation.php");
		}
	} else {
		$pdo = Database::connect();
		$pdo->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
		$sql = "SELECT * FROM personnel where id = $id";
		$q = $pdo->prepare($sql);
		$q->execute(array($id));
		$data = $q->fetch(PDO::FETCH_ASSOC);
		$name = $data['name'];
		$surname = $data['surname'];
		$grade = $data['grade'];
		$servicelog = $data['servicelog'];
		Database::disconnect();
	}
?>
 
 
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <link   href="css/bootstrap.min.css" rel="stylesheet">
    <script src="js/bootstrap.min.js"></script>
	<!--input dynamique -->
 
	<script  src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>        // Calling jQuery Library hosted on Google's CDN
 
<script type="text/javascript">
 
$(function() {
 
var addDiv = $('#addinput');
 
var i = $('#addinput p').size() + 1;
 
 
 
$('#addNew').live('click', function() {
 
$('<p><input type="text" id="servicelog" size="40" name="servicelog' + i +'" value="" placeholder="I am New" /><a href="#" id="remNew">Remove</a> </p>').appendTo(addDiv);
 
i++;
 
 
 
return false;
 
});
 
 
 
$('#remNew').live('click', function() {
 
if( i > 2 ) {
 
$(this).parents('p').remove();
 
i--;
 
}
 
return false;
 
});
 
});
 
 
 
</script>
 
		<!--input dynamique -->
 
</head>
 
<body>
 
    <div class="container">
 
    			<div class="span10 offset1">
 
 
	    			<form class="form-horizontal" action="update.php?id=<?php echo $id?>" method="post">
					  <div class="control-group <?php echo !empty($nameError)?'error':'';?>">
					    <label class="control-label">Name</label>
					    <div class="controls">
					      	<input readonly  name="name" type="text"  placeholder="Name" value="<?php echo !empty($name)?$name:'';?>">
					      	<?php if (!empty($nameError)): ?>
					      		<span class="help-inline"><?php echo $nameError;?></span>
					      	<?php endif; ?>
					    </div>
					  </div>
					  <div class="control-group <?php echo !empty($surnameError)?'error':'';?>">
					    <label class="control-label">Surname</label>
					    <div class="controls">
					      	<input readonly name="surname" type="text" placeholder="Surname" value="<?php echo !empty($surname)?$surname:'';?>">
					      	<?php if (!empty($surnameError)): ?>
					      		<span class="help-inline"><?php echo $surnameError;?></span>
					      	<?php endif;?>
					    </div>
					  </div>
					  <div class="control-group <?php echo !empty($gradeError)?'error':'';?>">
					    <label class="control-label">grade</label>
					    <div class="controls">
					      	<input readonly name="grade" type="text"  placeholder="grade" value="<?php echo !empty($grade)?$grade:'';?>">
					      	<?php if (!empty($gradeError)): ?>
					      		<span class="help-inline"><?php echo $gradeError;?></span>
					      	<?php endif;?>
					    </div>
					  </div>
 
 
					    <label class="control-label">Service</label>
					    <div id="addinput">
				<?php
$pdo = Database::connect();
$pdo->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
$sql = "SELECT servicelog FROM servicelog ORDER BY id DESC";
$q = $pdo->prepare($sql);
$q->execute();
$data = $q->fetchAll(PDO::FETCH_ASSOC);
Database::disconnect();
?>
<select  size=1 name="servicelog" id="servicelog">
<option value="-1">--liste service --</option>
<?php foreach($data as $value): ?>
<option value="<?php echo $value['servicelog'] ?>"> <?php echo $value['servicelog'] ?></option>
<?php endforeach; ?>
</select><a href="#" id="addNew">Add</a>
					    </div>
 
					  <div class="form-actions">
						  <button type="submit" class="btn btn-success"> update</button>
 
						  <a class="btn" href="affectation.php">  retour</a>
						</div>
					</form>
 
				</div>
 
    </div> <!-- /container -->
 
  </body>
</html>

**autran** · 04/06/2015, 17h56

sois clair dans la dexcription de ton bug :

qu'est ce qui ne marche pas met une copie de l'IHM qui deconne en nous disant ce que tu aimerais à la place ou idéalement l'URL de ta page comme ca on se debrouilleras pour recuperer tous les includes.

precise dans ton code source quels champs possedent pas de liste déroulante alors que tu penses en avoir mis une.

parce que la tu nous mets 200 lignes de code PHP + JS incomplete donc ...

Ajout d'input dynamique dans formulaire

JavaScript

Discussions similaires

Partager

Partager