multi.js
Version:
A user-friendly replacement for select boxes with multiple attribute enabled
63 lines (57 loc) • 1.89 kB
HTML
<html>
<head>
<meta charset="utf-8" />
<title>multi.js ES6 Import Example</title>
<!-- Include multi.js -->
<link rel="stylesheet" type="text/css" href="../dist/multi.min.css" />
<style>
/* Basic styling */
body {
font-family: sans-serif;
}
.container {
box-sizing: border-box;
margin: 0 auto;
max-width: 500px;
padding: 0 20px;
width: 100%;
}
</style>
</head>
<body>
<div class="container">
<h1>multi.js ES6 Import</h1>
<h3>When running as <em>file:///</em> you may get a CORS error</h3>
<form>
<select
required
multiple="multiple"
name="favorite_fruits"
id="fruit_select"
>
<option>Apple</option>
<option>Banana</option>
<option>Blueberry</option>
<option>Cherry</option>
<option>Coconut</option>
<option>Grapefruit</option>
<option>Kiwi</option>
<option>Lemon</option>
<option>Lime</option>
<option>Mango</option>
<option>Orange</option>
<option>Papaya</option>
</select>
<button type="submit">Submit</button>
</form>
</div>
<script type="module">
import multi from "../dist/multi-es6.min.js";
var select = document.getElementById("fruit_select");
multi(select, {
enable_search: false
});
</script>
</body>
</html>