Редактировать в состоянии выбрать поле с группировкой в настройках

Привет всем, я работаю над выпадающим/выберите поле.

Вот мое требование.

Я хочу иметь раскрывающееся окно, в котором есть группы параметров, а также возможность редактирования.

Для группировки я использовал <optgroup> и чтобы сделать его редактируемым, я использовал плагин jquery.editable.select. Но проблема в том, что, как только я назову редактируемым на своем selectbox, группировка исчезнет.

Вот мой код.

<select class= "myclass">
   <optgroup label="Dairy products">
      <option>Cheese</option>
      <option>Egg</option>
    </optgroup>
    <optgroup label="Vegetables">
      <option>Cabbage</option>
      <option>Lettuce</option>
      <option>Beans</option>
      <option>Onions</option>
    </optgroup>
</select>

Когда я это делаю, группировка исчезает.

$('.myclass').each(function(){
      $(this).editableSelect({
          bg_iframe: true,
          case_sensitive: false,
          items_then_scroll: 10,
      });
});

Может ли кто-нибудь помочь мне найти способ, чтобы я мог выполнять как редактирование, так и группировку.

Также я также нашел плагин Chosen Но я не могу редактировать поле выбора. Также я не хочу динамически добавлять этот параметр в свой список. Я просто хочу разрешить пользователю вводить текст.