I’m trying to setup Select2 for the first time following the examples on this page, but the result is not going as expected, it looks really weird and glitchy:
HTML:
<head>
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/select2.min.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/select2.min.js"></script>
<script src="main.js"></script>
</head>
<body>
<select class="option1"></select>
</body>
main.js:
var options1 = [
{id: 0, text: "text1"},
{id: 1, text: "text2"}
]
$(document).ready(function() {
$(".option1").select2({
data: options1,
placeholder: "Option 1",
allowClear: true
});
});
any idea what might be going on?
.