<div class="row">
<div class="col-sm-6">
<select class="form-control m-b" name="server_lists" id="server_lists">
<option>选择服务器</option>
{% for server_i in server_lists %}
<option value="{{ server_i.id }}">{{ server_i.public_ip }}</option>
{% endfor %}
</select>
</div>
<div class="col-sm-6 pull-right">
<select class="form-control m-b" name="server_lists" id="server_lists">
<option>选择服务器</option>
{% for server_i in server_lists %}
<option value="{{ server_i.id }}">{{ server_i.public_ip }}</option>
{% endfor %}
</select>
</div>
</div>
<div class="row">
<div class="col-sm-6">
<button type="button" class="btn btn-default" id='select-all'>全选</button>
<button type="button" class="btn btn-default" id='deselect-all'>全不选</button>
<select id='pre-selected-options' multiple='multiple' name="game_id">
</select>
</div>
</div>
<br>
<div class="row">
<div class="col-sm-4">
<button class="btn btn-primary" type="button" onclick="mtSelect(this)">
开始迁移
</button>
</div>
<script type="text/javascript">
$(document).ready(function () {
$('#pre-selected-options').multiSelect();
$('#select-all').click(function(){
$('#pre-selected-options').multiSelect('select_all');
return false;
});
$('#deselect-all').click(function(){
$('#pre-selected-options').multiSelect('deselect_all');
return false;
});
$("#server_lists").change(function () {
var server_i = $("#server_lists").val();
$.ajax({
data: {'obj_id': server_i, csrfmiddlewaretoken: '{{ csrf_token }}'},
type: 'POST',
url: '/pro1/gamemigratedata/' + server_i + '/',
success: function (data) {
var content = '';
$.each(data, function (i, item) {
content += '<option value='+'"'+item.gameid+'"'+'>'+item.gameid+'</option>'
});
alert(content);
$("#pre-selected-options").html(content)
}
})
});
});
</script>
应该是 js 的一个层级关系覆盖了
alert(content);
是有内容的
$("#pre-selected-options").html(content)
内容为空的
后来测试把
$('#pre-selected-options').multiSelect();
注释了就正常,但那个多选框功能不全
那现在这个情况要怎么改的?
1
Hasel 2018-09-03 21:03:34 +08:00
你可以在$("#pre-selected-options").html(content) 后面再初始化 multiSelect 试试。
|