Используя данный код, не получаю ожидаемого результата. Оформление select multiple остается стандартным, как будто я вообще никакой код не прописывал, т.е просто раскрытый выпадающий список, для выбора нужно нажимать ctrl + левая кнопка мыши. Подскажите, пожалуйста, где моя ошибка? Если это можно сделать как-то по другому, с другим оформлением, то тоже буду рад услышать совет по исправлению данного кода, главное чтоб была возможность осуществлять выбор показателей.
Для select id = "year" должна появиться возможность выбора галочками, как по отдельности каждый вариант, так и select all
Для select id = "station" должна появиться возможность выбора галочками: выбрать все, выбор группы, выбор по отдельности нужных пунктов.
<body>
{% if form_visible %}
<style>
......
</style>
<!-- Include Twitter Bootstrap and jQuery: -->
<link rel="stylesheet" href="css/bootstrap.min.css" type="text/css"/>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<!-- Include the plugin's CSS and JS: -->
<script type="text/javascript" src="js/bootstrap-multiselect.js"></script>
<link rel="stylesheet" href="css/bootstrap-multiselect.css" type="text/css"/>
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
<form method ="post" action="/">
<label for="year"></label>
<select type="number" id = "year" name ="year" class="form-control selectpicker" data-live-search="true" multiple>
<option value="2014">2014</option>
<option value="2015">2015</option>
<option value="2016">2016</option>
</select><br><br>
<script type="text/javascript">
$(document).ready(function() {
$('#year').multiselect({
includeSelectAllOption: true,
allSelectedText: 'No option left ...'
});
});
</script>
<label for="station"></label>
<select type="text" id ="station" name="station" class="form-control selectpicker" data-live-search="true" multiple>
<optgroup label="Челябинск">
<option value="москва">москва</option>
<option value="станция1">станция1</option>
<option value="станция2">станция2</option>
</optgroup>
<optgroup label="Питер">
<option value="питер">питер</option>
<option value="станция3">станция3</option>
<option value="станция4">станция4</option>
</optgroup>
</select><br><br>
<script type="text/javascript">
$(document).ready(function() {
$('#station').multiselect({
enableClickableOptGroups: true
});
});
</script>
<input type="submit" name="submit" class="btn btn-info" value="Применить" multiple/>
</form>
