0

I have a bootstrap multiple select-picker (not select) elements where my goal is to get the values out of them.

 <select id="custom_include" class="selectpicker" name='custom_include[]' data-header="Select target Groups" multiple data-actions-box="true" data-live-search="true" data-title="Target Groups"  data-show-tick="true" data-none-results-text="No groups matching" data-style="" data-style-base="form-control">
        {% for group in target_groups %}
           <option value="{{ group }}">{{ group }}</option>
        {% endfor %}
</select>

When I try searching by value:

$('#custom_include').val()

It returns only the first selected item in the dropdown.

When trying to search by selected text:

$('#custom_include').find("option:selected").text()

returns selected items stuck to each other as strings like the following example:

'dj dj.jewar@xol.comha ha.nyen@xol.com'

where the first entry is dj dj.jewar@xol.com and the second is ha ha.nyen@xol.com

When trying .text()

$('#custom_include').text()

it returns the entire content of the dropdown regardless what was selected.

For me it seems impossible but is there a way to return the selected values as arrays?

However, so far this seemed impossible to get all selected values.

Omar Abdelrazik
  • 683
  • 2
  • 9
  • 30
  • @CarstenLøvboAndersen please check the question again, I explained how this doesnt work – Omar Abdelrazik Jul 18 '22 at 09:41
  • 1
    1) `It returns only the first selected item in the dropdown` - no it doesn't, it returns an array: https://jsfiddle.net/RoryMcCrossan/vkgyhxr1/ 2) Your `select` has the `id` of `target_groups` not `custom_include`. – Rory McCrossan Jul 18 '22 at 09:42
  • *`.text()` returns items stuck together* - yes, that's how `.text()` works - it returns a single string. Try (OTOMH) `$('#custom_include').find("option:selected").map(e => $(e).text())` – freedomn-m Jul 18 '22 at 09:45
  • @freedomn-m I get a `index.js:36 Uncaught RangeError: Maximum call stack size exceeded` when doing that – Omar Abdelrazik Jul 18 '22 at 09:48
  • Not sure about that error, but my bad, as it was OTOMH, should be `.map(i, e) =>` as it's jquery map (I normally double check) and even the two jquery .map functions have their arguments swapped. https://jsfiddle.net/vwLjoa1n/ As noted above `$("select"0.val())` return an array: https://jsfiddle.net/vwLjoa1n/1/ – freedomn-m Jul 18 '22 at 09:53

0 Answers0