javascript сортировка option и value по алфавиту

173

25 июля 2018, 12:40

На странице есть списки например

<select multiple="multiple">
    <option value="2" selected="selected">С отделкой</option>
    <option value="3">Без отделки</option>
</select>
<select multiple="multiple">
    <option value="2" selected="selected">Банан</option>
    <option value="3">Абрикос</option>
<option value="4">Зелень</option>
</select>

Как выстроить эти списки по алфавиту(с сохранением value и selected у option) при загрузке страницы, чтобы получалось так

<select multiple="multiple">
    <option value="3">Без отделки</option>
    <option value="2" selected="selected">С отделкой</option>
</select>
<select multiple="multiple">
    <option value="3">Абрикос</option>
    <option value="2" selected="selected">Банан</option>
    <option value="4">Зелень</option>
</select>

Answer 1

function sortOptions(select) { 
  var items = [...select.querySelectorAll("option")]; 
  items.sort((a, b) => a.text == b.text ? 0 : a.text < b.text ? -1 : 1); 
  items.forEach(item => select.appendChild(item)); 
}

<select multiple="multiple" id="produce"> 
  <option value="2" selected="selected">Банан</option> 
  <option value="3">Абрикос</option> 
  <option value="4">Зелень</option> 
</select> 
 
<br/> 
<button onclick="sortOptions(document.getElementById('produce'))">Sort</button>