examples/singleSelect.html
<!DOCTYPE html>
<html>
<head>
<title>Single Select Example</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="https://cdn.polyfill.io/v2/polyfill.min.js"></script>
<script src='../dist/ui.js'></script>
</head>
<body>
<div class='month-picker'></div>
<div class='sort-menu'></div>
<script>
var month = new UI.SingleSelect('.month-picker', {
options: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
});
var sortmenu = new UI.SingleSelect('.sort-menu', {
options: [
{
display: 'Posted Date',
value: 'posted_date'
},
{
display: 'Relevance',
value: 'relevance'
},
{
display: 'Title',
value: 'title'
}
]
});
month.subscribe(function (choice) {
console.log('Its a new month!', choice);
});
sortmenu.subscribe(function (choice) {
console.log('The option selected is:', choice);
});
month.render();
sortmenu.render();
</script>
</body>
</html>