Для того чтобы получить значение выбранного элемента в виджете Select2 от Kartik, вы можете использовать следующий подход.
1. Сначала убедитесь, что у вас есть экземпляр виджета Select2 на странице. Если нет, добавьте его с помощью соответствующей директивы. Например:
echo Select2::widget([
'name' => 'select2',
'data' => ['1' => 'Option 1', '2' => 'Option 2', '3' => 'Option 3'],
'options' => ['multiple' => true, 'placeholder' => 'Select options...'],
]);
2. Чтобы получить значение выбранного элемента, вы можете использовать JavaScript и jQuery. Используйте следующий код:
var selectedValue = $('#select2').val();
Здесь select2 - это идентификатор элемента Select2. Если у вас есть другой идентификатор, замените его соответствующим образом.
3. В переменной selectedValue будет содержаться выбранное значение. Если установлен параметр multiple => true, то это будет массив значений.
4. Вы можете использовать selectedValue по своему усмотрению. Например, вы можете передать его на сервер для дальнейшей обработки или отобразить его на странице.
Вот пример полного скрипта, который демонстрирует получение значения виджета Select2:
<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.13/js/select2.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.13/css/select2.min.css" rel="stylesheet" />
</head>
<body>
<select id="select2" multiple="multiple">
<option value="1">Option 1</option>
<option value="2">Option 2</option>
<option value="3">Option 3</option>
</select>
<script>
$(document).ready(function() {
$('#select2').select2();
$('#select2').on('change', function() {
var selectedValue = $(this).val();
console.log(selectedValue);
});
});
</script>
</body>
</html>
С помощью этого кода вы сможете получить значение выбранного элемента виджета Select2 и использовать его по своему усмотрению.