Как реализовать функцию .select2 и .multiselect одновременно ⇐ Jquery

[Anonymous]

Я хочу создать пользовательский интерфейс, как на изображении 1, где пользователь должен видеть раскрывающийся список с множественным выбором и может выбрать несколько электронных писем с флажками, а также может пометить только одно электронное письмо как основной идентификатор электронной почты, щелкнув справа, как показано на изображении 1. Итак, в основном 2 все есть: 1 – можно выбрать несколько раскрывающихся флажков для электронных писем и 2 – можно выбрать/пометить любое электронное письмо как основное из выбранных флажков.

Кроме того, пользователь должен иметь возможность вводить и искать электронные письма. И если какие-либо электронные письма отсутствуют в раскрывающемся списке, он должен иметь возможность добавить их, как показано на изображении 2.

После этого при отправке мне нужно получить все выбранные идентификаторы электронной почты и иметь возможность отделить основной идентификатор электронной почты.

изображение 1

изображение 2

Я пробовал использовать .multiselect jquery, но смог получить только раскрывающийся список с множественным выбором, не смог добавить функцию выбора основного идентификатора и не смог добавить электронные письма, которых нет в раскрывающемся списке.

Ссылка на выходное изображение — https://ibb.co/rdcZkVh https://ibb.co/rdcZkVh

$('.share_quote_client_email').multiselect({ заполнитель: «Выбрать электронные письма», поиск: правда, выбрать все: правда, }); var options = $('#share_quote_modal_client_container').find('.ms-options').find('li'); если (options.length > 0) { options.each(функция(индекс) { отладчик; const htmlContent = '    Отметить как основной'; const suchLabel = $(this).find('label'); существующаяLabel[0].innerHTML += htmlContent; }); Выбрать клиента {% для клиента в клиентах %} ' {{client.email}} {% конец для %}