calebo calebo - 7 months ago 37
HTML Question

Different display value for selecte text using select2.js

Trying to implement a custom select dropdown using select2 plugin
Is it possible to have the selected value to display only the actual option 'value' instead of the text, so if I selected 'Australian Dollar', the selected text should only display 'AUD'

My mark-up looks something like this:

<select name="convert-to" id="convert-to">
<option value="AUD" data-currency="AUD">Australian Dollar</option>
<option value="USD" selected="selected">US Dollar</option>
<option value="JPY">Japanese Yen</option>
<option value="EUR">Euro</option>
<option value="GBP">British Pound</option>
<option value="CAD">Canadian Dollar</option>
<option value="HKD">Hong Kong Dollar</option>


Simply use the formatSelection option. It provides the text and value of the selected option and sets the selection's text.

function formatSelection(val) {

  formatSelection: formatSelection,
  width: 300