- Include the image-selecgtor.lib.js Library to your HTML Project:
<html>
<head>
<script src="image-selector.lib.min.js"></script>
...
</head>
...
</html>- Add the custom element tag to your HTML document:
<image-selector id="example_selector">
<image-option id="option_1" title="Option 1" image="filename/or/url/" />
<image-option id="option_2" title="Option 2" image="filename/or/url/" />
...
</image-selector>- It will be automatically initialized by the image-selector.lib.js Library.
- Get current selected option
// Option 1: Get Index
function getSelectedIndex() {
var selector = document.getElementById('example_selector');
var selectionIndex = ImageSelector.getCurrentSelectedIndex(selector);
return selectionIndex;
}
// Option 2: Get Option-Element
function getSelectedElement() {
var selector = document.getElementById('example_selector');
var selectionElement = ImageSelector.getCurrentSelected(selector);
return selectionElement;
}- Set current selected option
// Option 1: Set selected option by index
function setSelectedIndex(index) {
var selector = document.getElementById('example_selector');
ImageSelector.setSelectedIndex(selector, index);
}
// Option 2: Set selected option by option id
function setSelectedById(id) {
var selector = document.getElementById('example_selector');
ImageSelector.setSelectedOptionById(selector, 'option_1');
}
// Option 3: Set selected option by option element
function setSelectedOption(option) {
ImageSelector.setSelectedOptionById(option);
}| Function | Return Type | Description |
|---|---|---|
ImageSelector.setSelectedIndex(selector, index)
|
<void> | Set the selected option for a selector by a specific option index |
ImageSelector.setSelectedOptionById(selector, optionId)
|
<void> | Set the selected option for a selector by a specific option id |
ImageSelector.setSelectedOption(option)
|
<void> | Set the selected option for a selector by a given option |
ImageSelector.setOnSelectListener(selector, fct, replaceExisting)
|
<void> | Set an OnSelectListener |
ImageSelector.getItemCount(selector)
|
<number> | Get the number of options for a given selector |
ImageSelector.getCurrentSelected(selector)
|
<HTMLElement|null> | Get the current selected selector option |
ImageSelector.getCurrentSelectedIndex(selector)
|
<number> | Get the index of the current selected selector option |
ImageSelector.getIndexOf(option)
|
<number> | Get the index of a given options Item |