我正在使用attribute
,现在我遇到了一个问题,当我想用chosen.js
动态追加数据时,它不会更新。根据所选的 official website ,你应该使用这个:
ajax
我做到了,但它不能与ajax一起使用,但可以使用简单的附加功能。我把这段代码成功了,但看起来这段代码比追加运行得更快。任何想法?
$('.my_select_box').trigger('chosen:updated');
$('.chosen-select').chosen();
$('#Update').click(function() {
$.ajax({
type: "POST",
dataType: 'json',
url: 'xxxxx.json',
success: function(data) {
$('select').append('<option value="' + data[i]['id'] + '">' + data[i]['title'] + '</li>');
$('.chosen-select').trigger('chosen:updated'); // update chosen
}
});
});
select {
width: 200px;
}
答案 0 :(得分:0)
我建议您使用 Select2 ,因为它支持实时追加(包含ajax),那么您无需使用任何trigger
来更改或更新或任何elese。 Select2
比extensible
更多chosen
。
轻松将chosen
转换为select2
:
$('.chosen-select').select2({
placeholder: 'Select an option'
})
示例:
$('.chosen-select').select2();
i = 3;
$('#Update').click(function() {
i++;
$('select').append('<option>'+i+'</li>');
});
select {
width: 200px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.5/js/select2.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.5/css/select2.css" />
<select class="chosen-select" multiple>
<option>1</option>
<option>2</option>
<option>3</option>
</select>
<a id="Update">Update</a>