0

I have a multiple select and I want to get selected text and not the value.

What I mean is this :

<option value="1100"> MH-03-P-9429</option>

And I want to get MH-03-P-9429 as selected text, but when I do 

$("#usersDropDown").multipleSelect('getSelects')

I get output as 1100 as shown in fiddle.

Multiple Select Issue

Can anyone help me out here ?

How can I get selected option text and not the value ?

NOTE : .text() and .val() doesn't work against getSelects

Ashish Bahl
  • 1,482
  • 1
  • 18
  • 27
  • Need to raise event after selection [fiddle](https://jsfiddle.net/pandeyvishal1986/850xcwh8/2/#&togetherjs=g24REQzRF0) – RonyLoud Mar 17 '17 at 12:32

3 Answers3

4

Use this combination:

 ("option:selected").text();

See FIDDLE and/or Snippet 2 for how it applies to your specific code.

SNIPPET 1

$('#sel').on('change', function() {
  var txt = $(this).find("option:selected").text();
  $('output').val(txt);
});
#sel {font:inherit}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id='sel'>
<option>TEXT1</option>
<option>TEXT2</option>
<option>TEXT3</option>
<option>TEXT4</option>
</select>
<output></output>

SNIPPET 2

$("#usersDropDown").multipleSelect({
  placeholder: "Select Users",
  selectAll: true,
  width: "100%",
  filter: true
});
$("#usersDropDown").on('change', function(e) {
  var getSelected = $("#usersDropDown").find("option:selected").text();
  alert(getSelected);

});
<link href='https://rawgit.com/wenzhixin/multiple-select/master/multiple-select.css' rel='stylesheet'>

<select id="usersDropDown" multiple="multiple" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="Select Users">
  <option value="1100"> MH-03-P-9429</option>
  <option value="1101"> MH-03-A-2104</option>
  <option value="1102"> MH-03-PB-8413</option>
  <option value="1103"> MH-03-BP-3000</option>
  <option value="1104"> MH-03-PA-9400</option>
</select>


<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/multiple-select/1.2.0/multiple-select.js'></script>
zer00ne
  • 41,936
  • 6
  • 41
  • 68
1
$("#usersDropDown").multipleSelect({
  placeholder: "Select Users",
  selectAll: true,
  width: "100%",
  filter: true,
});

$("#usersDropDown").on('change',function ()
{

var textss= $(".ms-choice span:first").text();
alert(textss);
});

Use this to get all selected text https://jsfiddle.net/850xcwh8/4/

Just code
  • 13,553
  • 10
  • 51
  • 93
1

Try this:

$("#usersDropDown").multipleSelect({
  placeholder: "Select Users",
  selectAll: true,
  width: "100%",
  filter: true,
});
$("#usersDropDown").on('change',function ()
{
  var getSelected = $("#usersDropDown").multipleSelect('getSelects', 'text');
  alert(getSelected)
});
Ram Depala
  • 51
  • 3