Rails с MaterializeCSS генерирует «вход» в дополнение к «select», делает невозможной динамическую загрузку - PullRequest
Новая
       19

Rails с MaterializeCSS генерирует «вход» в дополнение к «select», делает невозможной динамическую загрузку

0 голосов
/ 06 марта 2019

Я использую Rails 5.2.0 с Slim-lang и MaterializeCSS

Я использую JavaScript для динамического заполнения выпадающего списка, как показано здесь .

Код работает в том смысле, что элемент select заполняется правильно. Однако комбинированный список, отображаемый на экране, не заполняется! При проверке вывода html в браузере Chrome я обнаружил, что «select» на самом деле состоит из: 

<input class="select-dropdown dropdown-trigger" type="text" readonly="true" data-target="select-options-f6b96705-f301-b1b9-c113-84ee91f6897a">
<ul id="select-options-f6b96705-f301-b1b9-c113-84ee91f6897a" class="dropdown-content select-dropdown" tabindex="0" style="">
</ul>
<select id="crit_type" name="crit_type" onchange="loadCritValues(this.value)" tabindex="-1"><option value="Select Criteria">Select Criteria</option>
  <option value="age_group">age_group</option>
  <option value="gender">gender</option>
  <option value="current_country">current_country</option>
  <option value="home_country">home_country</option>
  <option value="first_language">first_language</option>
</select>

Как видите, выбранные параметры правильно заполнены. Но оказывается, что элементы input и ul определяют, что будет отображаться на экране. И "ul", естественно, пуст.

Есть ли способ решить эту проблему, кроме необходимости также изменить содержимое "ul"?

1 Ответ

0 голосов
/ 07 марта 2019

Оказывается, проблема, с которой я сталкиваюсь при выборе, связана с MaterializeCSS. HTML, который он генерирует, структурирован в формате, который я упомянул согласно:

https://materializecss.com/select.html

Я могу просто переопределить это поведение, назначив класс «browser-default» тегу select:

select id = "crit_type" name = "crit_type" onchange = "loadCritValues ​​()" class = "browser-default" = options_for_select (@crit_types)

Это обеспечит тег select только без дополнительных html-элементов и позволит мне манипулировать select с помощью javascript.

...