JavaScript library for custom HTML <select>
.
No dependencies needed.
In HTML with the script
tag:
build/assets/js/custom-select.js
<script src="custom-select.js" type="text/javascript"></script>
and:
build/assets/css/custom-select.css
<link rel="stylesheet" href="custom-select.css">
build/index.html
Start with a simple HTML <select>
:
<select class="my-select-element">
<option value="1">Test 1</option>
<option value="2">Test 2</option>
<option value="3">Test 3</option>
</select>
const customSelect = new CustomSelect('.my-select-element');
The additional settings is:
{
containerClass: '',
selectValueClass: '',
headClass: '',
optionsClass: '',
}
get selected value
const customSelect = new CustomSelect('.custom-select-element');
const selectedValue = customSelect.getValue();
set value
const customSelect = new CustomSelect('.custom-select-element');
const selectedValue = customSelect.setValue('1');
const customSelect = new CustomSelect('.custom-select-element');
customSelect.onChange( (data) => {
console.log('onChange', data);
})