html<label>
Single select
<input mbsc-input id="my-input" data-dropdown="true" />
</label>
<select id="single-group-select">
<optgroup label="US">
<option value="atl">Atlanta</option>
<option value="bos">Boston</option>
</optgroup>
<optgroup label="UK">
<option value="bat">Bath</option>
<option value="bri">Bristol</option>
</optgroup>
</select>
js$('#single-group-select').mobiscroll().select({
inputElement: document.getElementById('my-input'),
touchUi:
});
html<label>
Single select
<input mbsc-input id="my-input" data-dropdown="true" />
</label>
<select id="single-group-select">
<optgroup label="US">
<option value="atl">Atlanta</option>
<option value="bos">Boston</option>
</optgroup>
<optgroup label="UK">
<option value="bat">Bath</option>
<option value="bri">Bristol</option>
</optgroup>
<optgroup label="DE">
<option value="ber">Berlin</option>
<option value="dus">Duisburg</option>
<option value="col">Cologne</option>
</optgroup>
<optgroup label="FR">
<option value="par">Paris</option>
<option value="lyo">Lyon</option>
</optgroup>
</select>
js$('#single-group-select').mobiscroll().select({
showGroupWheel: true,
inputElement: document.getElementById('my-input'),
touchUi:
});
html<label>
Multi-select
<input mbsc-input id="my-input" data-dropdown="true" data-tags="true" />
</label>
<select id="multiple-group-select">
<optgroup label="Electronics">
<option value="1">Camera & Photo</option>
<option value="2">Cell Phones & Accessories</option>
<option value="3">GPS & Navigation</option>
</optgroup>
<optgroup label="Smart Home">
<option value="4">Plugs and Outlets</option>
<option value="5">Heating and Cooling</option>
<option value="6">Detectors and Sensors</option>
</optgroup>
</select>
js$('#multiple-group-select').mobiscroll().select({
inputElement: document.getElementById('my-input'),
touchUi:
});