我正在使用 easyadmin 包为我的 Symfony4.2 站点创建一个后端。在为我的实体创建的新/编辑表单中,它会创建一个下拉列表以供选择。但是,在 chrome 和 firefox 中,这些下拉菜单的行为不如预期。当我单击它们时,它会显示选项,但如果我选择一个选项或单击远离下拉菜单,它不会关闭。它在 Safari 和 Edge 上运行良好。
这是easyadmin.yaml
easy_admin:
#Global Settings
site_name: 'Physics Quiz SIte'
design:
assets:
favicon: '/build/images/favicon.ba133a8b.ico'
# this is the default form theme used by backends
form_theme: '@EasyAdmin/form/bootstrap_4.html.twig'
# these custom templates are applied to all entities
brand_color: '#1ABC9C'
menu:
- { label: 'Public Homepage', route: 'homepage', icon: 'home' }
- { entity: 'User', icon: 'user' }
- { entity: 'QuestionType' }
- { entity: 'Question' }
- { entity: 'Quiz' }
show:
max_results: 10
list:
actions:
- { name: 'edit', icon: 'pencil'}
- { name: 'delete', icon: 'trash'}
# allow deleting multiple items at once ...
batch_actions: ['delete']
# List the entity class name you want to manage
entities:
Quiz:
class: App\Entity\Quiz
form:
fields:
- property: 'quizname'
label: 'Quiz Name'
- property: 'course'
type: 'entity'
type_options:
expanded: false
multiple: false
这是创建的相关页面源:
<div class="col-12 ">
<div class="form-group field-entity">
<label class="form-control-label required" for="quiz_course">Course</label>
<div class="form-widget">
<select id="quiz_course" name="quiz[course]" data-widget="select2" class="form-control">
<option value="1">Year 10 Physics</option>
<option value="2">Year 11 Physics</option>
</select>
</div>
</div>
</div>
以下是可能相关的脚本。
<script src="/bundles/easyadmin/select2/i18n/en.js"></script>
<script type="text/javascript">
$(function() {
// Select2 widget is only enabled for the <select> elements which
// explicitly ask for it
function init() {
$('form select[data-widget="select2"]').select2({
theme: 'bootstrap',
language: 'en'
});
}
$(document).on('easyadmin.collection.item-added', init);
init();
});
</script>
这是渲染下拉列表的图片: