Multiselect ui - Ajouter un item non présent dans la liste

Version imprimable

Bonsoir,

J'utilise multiselect ui et je cherche à donner la posibilité d'ajouter une option a une liste avec un champ text

j'ai essayé ça, mais ça ne fonctionne pas :

Code:

1
2
3
4
5
6
7
8
9
10
 
<select class="multiselect" name="field_17" id="field_17" multiple="multiple">
		<?php include('lsttsk.php');
		foreach ($lstespace as $valeur=>$field_17) {
			$selected = (isset($_SESSION['field_17']) && $_SESSION['field_17'] ==$valeur) ? ' selected="selected"' : "";
			echo '<option value="' . $valeur . '"' . $selected .'>' . $field_17 . '</option>';
		} ?>
</select>
<input name="name" type="text" id="name" />
<input type="button"  id="add" name="add" value="Ajouter" />

Code:

1
2
3
4
5
6
7
8
9
10
11
 
$(document).ready(function() {
 
	$(".multiselect").multiselect();
	$("#add").click(function() {
		var name = $("#name").val();
	$('#field_17').append(name);
	$("#name").val('');
	 return false; 
	});	
});

Merci de votre aide

Bonjour,

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
  <select>
    <option>Option #1</option>
  </select>
<script>
  $("select").append('<option>Option #2<\/option>');
</script>
</body>
</html>

plus d'info sur la méthode .append()

Il faut rafraichir le multiselect après un ajout :

Code:

1
2
3
4
5
6
7
8
9
10
11
$(document).ready(function() {
 
	$(".multiselect").multiselect();
	$("#add").click(function() {
		var name = $("#name").val();
	$('#field_17').append(name);
	$("#name").val('');
	$(".multiselect").multiselect('refresh');
	 return false; 
	});	
});

13/10/2012, 10h16
NoSmoking

:oops: pas vu le contexte.
13/10/2012, 12h15
SpaceFrog

Quand cesserez vous de chercher les ennuis en nommant de variables name ou id ... etc.
15/10/2012, 20h37
fahdo

Bonsoir,

Merci pour vos réponse et vos remarque.
Ca ne fonctionnait pas parce que je n'avais pas mis la bonne id pour append lol.

Sinon la valeur se mets au bonne endroit mais sans les fonctions de drag and drop, et de bascule d'une liste a l'autre.
Pour que ceci fonctionne je pense qu'il faudrait développer une nouvelle fonction a l'api dont je ne suis pas capable de réaliser pour le moment.

Tant pis je vais devoir faire sans ou trouver autre chose.

Merci tout de meme
16/10/2012, 07h55
Bovino

Citation:

Envoyé par fahdo

Sinon la valeur se mets au bonne endroit mais sans les fonctions de drag and drop, et de bascule d'une liste a l'autre.
Pour que ceci fonctionne je pense qu'il faudrait développer une nouvelle fonction a l'api dont je ne suis pas capable de réaliser pour le moment.

Euh... c'est pourtant ce que je t'ai proposé :roll:

Code:

$(".multiselect").multiselect('refresh');
17/10/2012, 12h59
fahdo

Bon bah je regarderai ça ce soir, merci de votre aide
19/10/2012, 23h56
fahdo

Bon bah pas mieux :(

J'ai trouvé :)

J'ai du rajouter dans le script

Code:

1
2
3
refresh: function() {
            this._populateLists(this.element.find('option'));
        },

Merci

01/11/2012, 18h26
y_akalal

bonjour,
ça fait plus que 6 mois que j'ai travaillé sur la widget multiselect de Eric hynds j'ai pu ramener plusieurs améliorations et dynamique à ce multiselect
les liens de téléchargement et doc sont sur mon blog http://www.youssef-akalal.blogspot.c...select-ui.html

je voudrais svp avoir votre retour de professionels sur le widget.

merci d'avance