templateResult показывает выбранный true для нескольких элементов

Я использую jquery-select2 (4.0.0). Проблема в том, что когда я выбираю опцию, затем выбираю другую опцию, item.selected остается верным для обеих опций - НАВСЕГДА. Есть ли какая-то начальная опция конфигурации, которую я пропускаю, или это ошибка?

function formatResult(item) {
  console.log("item selected = ", item.selected);
  return item.text;
}

$('select').select2({
  templateResult: formatResult,
  minimumResultsForSearch: Infinity,
  placeholder: "Please choose",
  multiple: false,
  maximumSelectionSize: 1
});
<link href="//cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/css/select2.css" rel="stylesheet"/>

<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/js/select2.js"></script>

<select>
  <option></option>
  <option>conan</option>
  <option>kimmel</option>
  <option>stewart</option>
  <option>colbert</option>
</select>

1 ответ

Я должен начать это с того, что item.selected (selected свойство объекта данных) не документировано и будет меняться в будущем. Почему я говорю, что будет? Потому что эта ошибка возникает только для отдельных элементов выбора (как объяснено в самом конце), но вы можете смело игнорировать ее сейчас.

Сейчас item.selected свойство используется только Select2 на <input /> элементы, а item.element.selected свойство используется для <select> элементы. Это всегда будет вашим источником правды при использовании <select> элемент, как item.element это ссылка на <option> элемент, который ваш браузер использует для определения того, какие данные должны быть отправлены на сервер.

Вы можете увидеть, посмотрев на item.element.selected что он корректно обновляется при изменении выбора.

function formatResult(item) {
  console.log("item selected = ", item.selected);
  console.log("item.element.selected = ", item.element && item.element.selected);
  return item.text;
}

$('select').select2({
  templateResult: formatResult,
  minimumResultsForSearch: Infinity,
  placeholder: "Please choose",
  multiple: false,
  maximumSelectionSize: 1
});
<link href="//cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/css/select2.css" rel="stylesheet"/>

<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/js/select2.js"></script>

<select>
  <option></option>
  <option>conan</option>
  <option>kimmel</option>
  <option>stewart</option>
  <option>colbert</option>
</select>

И да, item.selected собственность будет исправлена ​​в будущем, поэтому она является точной. Прямо сейчас он не обновляется, потому что при одном выборе выбираются новые параметры, а те неявно отменяют старые параметры. Это не похоже на множественный выбор, когда параметры явно выбраны и не выбраны.

Другие вопросы по тегам