CODEWITHSUNDEEP
javascriptjqueryhtmlcss
Antoine089
Antoine089

Reputation: 458

Make dropdown multi-select

I have 2 dropdowns and one of them(the second one) is dynamic in the sense that its values change according to the option chosen in the first dropdown.

JSFiddle result: http://jsfiddle.net/pgbw56vb/10/embedded/result/

Can someone pls show me how i can make the second dropdown a multi-select? I'm really green in Jquery and html.

JSFiddle: http://jsfiddle.net/pgbw56vb/10/

 <select id="kategorie_oder_seite"></select>

 <select id="auswahl"></select>

 var data = {
 "Kategorie": ["Kraft", "Startseite", "Insurance", "Risk",],
 "Seite": ["http://jsfiddle.net/tony089/pgbw56vb/2/",     "https://stackoverflow.com/users/login?returnurl=%2fquestions%2fask"],
 };


 var $kategorien = $("#kategorie_oder_seite").on("change", function() {
 var seiten = $.map(data[this.value], function(seite) {
    return $("<option />").text(seite);
 });
 $("#auswahl").empty().append(seiten);
 });

 for (var kategorie in data) {
 $("<option />").text(kategorie).appendTo($kategorien);
 }

 $kategorien.change();

Thanks in advance.

Upvotes: 1

Views: 1640

Answers (3)

Norrj
Norrj

Reputation: 114

Add multiple to your select tags. 

 <select id="kategorie_oder_seite" multiple></select>  
 <select id="auswahl" multiple></select>

Upvotes: -1

OshoParth
OshoParth

Reputation: 1552

you can use the multiple attribute of select tag and set its value to multiple. also remember to set the name property in array form so that you could send multiple values via this select control.

eg. 

<select multiple="multiple" id="kategorie_oder_seite" name="check[]"></select>

JsFiddle: http://jsfiddle.net/pgbw56vb/10/

Upvotes: 4

Jimmy Febio
Jimmy Febio

Reputation: 24

just add "multiple" attribute on the "select" tag

Upvotes: -1

Related Questions