Я не знаю много о jQuery, но я нашел полезный фрагмент, который я хотел включить в свой код.
Я пробовал следующее:
<form>
<fieldset>
<legend>Kies je activiteiten</legend>
<select id="tenemen" class="chosen-select" multiple style="width:350px;" multiple>
{% for activiteit in activiteiten %}
<option value="{{activiteit.id}}" selected>{{activiteit.name}}</option>
{% endfor %}
</select>
<select id="telaten" class="chosen-select" multiple style="width:350px;" multiple>
</select>
</fieldset>
</form>
<script>
$('#tenemen').change(function(){
$('#telaten').html(''); //Clear
$('#tenemen option:not(:selected)')
.clone()
.appendTo('#telaten')
})
</script>
Тегами {%%} являются Jinja's, но это не имеет значения.
Я пробовал его в JSFiddle, и он работает, поэтому я не понимаю, почему он не работает в моем шаблоне. jQuery загружается в базовый шаблон следующим образом: <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.js"></script>
Я действительно не знаком с jQuery, так что это может быть что-то очень глупое. Любая помощь приветствуется.
вам нужно подождать, пока документ будет готов...
$(function(){
$('#tenemen').change(function(){
$('#telaten').html(''); //Clear
$('#tenemen option:not(:selected)')
.clone()
.appendTo('#telaten')
})
})
причина, по которой он работает в jsfiddle, заключается в том, что jsfiddle автоматически запускает ваш код "onload". когда вы вставляете код в настоящий html файл, вам нужно сообщить браузеру, что он должен ждать, пока документ не будет загружен перед выполнением кода.