JQuery - Multiple Select Options

Question

I am trying to grab all selected items in the following select multiple and separate them by a comma. The code is below:

<select id="ps-type" name="ps-type" multiple="multiple" size="5">     <option>Residential - Wall Insulation</option>     <option>Residential - Attic /Crawl Space Insulation</option>     <option>Residential - Foundation Insulation</option>     <option>Residential - Exterior Roof System</option>     <option>Commercial - Wall Insulation</option>     <option>Commercial - Air Barrier System (Walltite)</option>     <option>Commercial - Roof System</option> </select> 

The result I am looking for is the following:

Residential - Wall Insulation, Commercial - Wall Insulation, ...

Answer 1

You can use the :selected selector, and the inline $.map() function as part of your chain.

$("option:selected").map(function(){ return this.value }).get().join(", "); 

Answer 2

Add the values to an array and use join to create the string:

var items = []; $('#ps-type option:selected').each(function(){ items.push($(this).val()); }); var result = items.join(', ');