bootstrap-select下拉框复选-（ajax传值）

一. 描述：在使用bootstrap-select插件的时候，静态写<option>的时候可以正常展示，但是很多时候，我们需要结合上ajax。很多人在结合上ajax的时候，就出现了各种问题，本文章就是针对遇到问题的学习者，进行整理处理的。代码下载https://pan.baidu.com/s/1hsmRE88

二. 先贴上代码吧

<script src="http://libs.baidu.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>

三. 代码说明

0. 注意，引入的所有文件路径要保持正确，我在引入的时候，引入bootstrap-select.min.css或者.min.js文件的时候，效果出错，保险起见，不要引入min类的bootstrap-select

<link rel="stylesheet" type="text/css" href="bootstrap-select.css">
<link href="http://libs.baidu.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
<script src="http://www.jq22.com/jquery/jquery-1.10.2.js"></script>
<script type="text/javascript" src="bootstrap-select.js"></script>
<script src="http://libs.baidu.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>

1. 我的思路是采用ajax，接受数据：

$.post('/bin/mydata',function(res){}

2. 数据中有一个叫name的数据。接收到数据以后，我用for遍历，加上字符串拼接的形式：

for(var i = 0;i <res.length;i++){
txt += '<option>' + res.name +'</option>';
}

3. 完字符串，获取我的select标签的id，把它当作一个容器，将拼接起来的 txt 传入进去，使用documen获取标签，不要用$，否则出错：

document.getElementById('mysel').innerHTML=txt;

4.传入进入后，下拉框并没有得到值，这时需要重刷新一下：

$('.selectpicker').selectpicker('refresh');

四. 总结

使用bt-select组件，结合ajax+vue绑定数据到该组建的option中。ajax得到数据能打印出来，但是多选下拉框一直没有数据，

尝试改用静态数据，可以正常展示。

考虑到v-for绑定位置，和vue中this指针，和{{item.xx}}问题，仍然不显示。

（放弃上面的选择，重新开始）最后选择使用原生拼接txt，注意txt写到循环体外面，再传入到select中，打印拼接好的txt无误，依然不展示数据，

考虑到是否需要重刷新加入$('.selectpicker').selectpicker('refresh')；可以正常展示数据了。

如果还还还不显示，就要考虑不适用min类型的引入文件——————

最后要得到多选下拉框的值，先定义potion中的value=res[i].id,用$("#你的id").val()；获取可以得到id。