Fahad Fahad - 4 months ago 39
jQuery Question

How to post multiselect selected options as one param in url - Bootstrap Multiselect

I am using bootstrap-multiselect and need to submit form with selected options.

However on form submit, url gets like this

....&sites=1&sites=2&sites=3
while I need it to be
...&sites=1,2,3


Here is my code:

<select id="sites" name="sites" class="form-control" multiple="multiple">
<option value="1">Site 1</option>
<option value="2">Site 2</option>
<option value="3">Site 3</option>
</select>


JS:

$('button[type=submit]').click(function () {

var text = $('#sites').val()
//I have the list in `text` as 1,2,3 which need to in url
//do the rest and continue submit


How can I POST these selected values in url (i.e
url/sites=1,2,3
instead of
url/sites=1&sites=2&sites=3
)

Thanks for any help!

Answer

I got it done by using a hidden field.

var text = $('#sites').val();
$('#sites_hidded').val(text);

with html (removed name attr from select so it will not submit with form)

<select id="sites" class="form-control" multiple="multiple">
    <option value="1">Site 1</option>
    <option value="2">Site 2</option>
    <option value="3">Site 3</option>
</select>
<input type="hidden" name="sites" id="sites_hidden">