Skip to content

Commit 224e1f3

Browse files
authored
test: improve bootstrap test page (#999)
add aria-label example
1 parent 81ce0d4 commit 224e1f3

1 file changed

Lines changed: 39 additions & 35 deletions

File tree

test/html/bootstrap5.html

Lines changed: 39 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -2,47 +2,51 @@
22
<html>
33
<meta charset="utf-8">
44
<head>
5-
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.7/dist/css/bootstrap.min.css">
5+
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/css/bootstrap.min.css">
66
<link rel="stylesheet" href="../../dist/css/tom-select.bootstrap5.css">
7-
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.7/dist/js/bootstrap.bundle.min.js"></script>
7+
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/js/bootstrap.bundle.min.js"></script>
88
<script src="../../dist/js/tom-select.complete.js"></script>
99
</head>
10+
1011
<body class="p-4">
11-
<h3>form-select</h3>
12-
<select class="form-select ts">
13-
<option value="1">Option 1</option>
14-
<option value="2">Option 2</option>
15-
<option value="3">Option 3</option>
16-
<option value="4">Option 4</option>
17-
</select>
12+
<h1>Tom Select Boostrap 5</h1>
13+
14+
<h2>form-select with aria-label</h2>
15+
<select aria-label="describe form here" class="form-select ts">
16+
<option value="1">Option 1</option>
17+
<option value="2">Option 2</option>
18+
<option value="3">Option 3</option>
19+
<option value="4">Option 4</option>
20+
</select>
1821

19-
<hr/>
22+
<hr/>
2023

21-
<h3>form-select-sm</h3>
22-
<select class="form-select form-select-sm ts">
23-
<option value="1">Option 1</option>
24-
<option value="2">Option 2</option>
25-
<option value="3">Option 3</option>
26-
<option value="4">Option 4</option>
27-
</select>
24+
<h2>form-select-sm</h2>
25+
<select class="form-select form-select-sm ts">
26+
<option value="1">Option 1</option>
27+
<option value="2">Option 2</option>
28+
<option value="3">Option 3</option>
29+
<option value="4">Option 4</option>
30+
</select>
2831

29-
<hr/>
32+
<hr/>
3033

31-
<h3>form-select-lg</h3>
32-
<select class="form-select form-select-lg ts">
33-
<option value="1">Option 1</option>
34-
<option value="2">Option 2</option>
35-
<option value="3">Option 3</option>
36-
<option value="4">Option 4</option>
37-
</select>
38-
<script>
39-
document.querySelectorAll('.ts').forEach(function (select) {
40-
new TomSelect(select, {
41-
persist: false,
42-
createOnBlur: true,
43-
create: false
44-
});
45-
});
46-
</script>
47-
</body>
34+
<h2>form-select-lg</h2>
35+
<select class="form-select form-select-lg ts">
36+
<option value="1">Option 1</option>
37+
<option value="2">Option 2</option>
38+
<option value="3">Option 3</option>
39+
<option value="4">Option 4</option>
40+
</select>
41+
<script>
42+
document.querySelectorAll('.ts').forEach(function (select) {
43+
new TomSelect(select, {
44+
persist: false,
45+
createOnBlur: true,
46+
create: false,
47+
onInitialize: () => console.log('TomSelect is now initialized'),
48+
});
49+
});
50+
</script>
51+
</body>
4852
</html>

0 commit comments

Comments
 (0)