bootstrap动态调用select下拉框

html代码:

  1. <label for="classify" class="col-sm-2 control-label">填报部门:</label>
  2. <div class="col-sm-3">
  3. <select class="selectpicker form-control" data-live-search="true" name="addid" id="addid">
  4. </select>
  5. </div>
 JS代码:
  1. /*获取下拉菜单*/
  2. function showSel(){
  3. $.ajax({  
  4.         "type" : ‘get‘,  
  5.         "url": 地址,
  6.         "dataType" : "json",  
  7.         "success" : function(data) {  
  8. var depart_list = data.data;
  9. var opts = "";
  10. for( var depart_index = 0 ; depart_index < depart_list.length; depart_index++ ){
  11. var depart = depart_list[depart_index];
  12. opts += "<option value=‘"+需要加的.id+"‘>"+显示的名称.name+"</option>";
  13. }
  14. // 查询界面
  15. $("#addid").append(opts);  
  16. $("#addid").selectpicker("refresh");
  17. }  
  18. });  
  19. }

这样就可以了

原文地址:https://www.cnblogs.com/zhuyeshen/p/11419262.html

时间: 2024-08-28 20:36:00

bootstrap动态调用select下拉框的相关文章

jQuery动态生成&lt;select&gt;下拉框

前一阵在项目里需要动态生成下拉框,找了一下用jQuery实现比较方便,这里整理一下. 下文所述方法只是本人在项目中遇到问题的解决方法,场景较为简单,也希望能帮助有需要的朋友 1.动态生成下拉框的两种方式 (1)将数据放在model中,JSP页面用EL表达式${}取出,该方式缺点是数据更改时必须刷新整个页面,本文不过多描述. (2)就是本文要说的jQuery动态生成了,该方式适合数据频繁变动的场景. 2.<select>组成 <select> <option value=”aa

jqGrid动态填充select下拉框的选项值

function gettypes(){ //动态生成select内容 var str=""; $.ajax({ type:"post", async:false, url:"checkpersontype", success:function(data){ if (data != null) { var jsonobj=eval(data); var length=jsonobj.length; for(var i=0;i<length;

Bootstrap Flat UI的select下拉框显示问题解决

bootstrap中文网(http://www.bootcss.com/)里推荐项目有Flat UI(http://www.bootcss.com/p/flat-ui/),非常漂亮,而且少有的竟然具有select下拉框. 我直接打开example(Flat-UI-master/docs/examples/select.html)都是可以的,但是放到我的网站里则不行. 使用chrome调试经过分析,原因是: $('[data-toggle="select"]').select2(); 这

bootstrap select 下拉框没选择

情况:根据取得的值去选定select下拉框的选项.但不知为何每次根据select的id传递值过去了,也能取得对应的值,但是页面上的select依然是下拉框第一个选项,但点击下拉框时,会在对应的值有特殊css(选中标志),即改变了值,却没改变现实的值.原因:设置select的选中的option,并没有修改对应的span的值跟title.<span class="select2-selection__rendered" id="select2-字段ID-container&

模拟select下拉框之多选(数据源采用模拟Ajax数据--原创)

最近需要一个下拉多选,本来想偷懒的,所以在网上百度了一番,最终还是发现没有一个符合自己要求的,所以我自己写了一个插件.下面是GIF动态效果图展示 相信大家已经看到效果了,接下来就是我的代码展示 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>模拟select下拉框之多选</title> <style

select下拉框左右变换

效果图: 使用jQuery插件---multiselect2side做法: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://ww

自定义样式的select下拉框

在网上看到了一个写的挺好挺简单的自定义select样式的插件,在理解了它的原理之后,自己也尝试着写了一个. 核心思想:将原来的<select><option></option></select>隐藏掉动态写进页面一个<div>在这里面用<dl><dt><dd>这样的结构代替原来的下拉框. 大概框架:<div class="i_selectbox">//这是用来包裹整个自定义的se

自定义样式的select下拉框深入探索

第一个版本: 首先实现自定义select下拉框应该具有的功能,我是选择将原来的select隐藏掉,自己在jquery代码中动态写进去<dl><dd><dt>这样的结构来模拟真正的select的操作. 用来模拟select框的div结构如下: <div class="selectbox">//包裹整个模拟框的盒子 <div class="currentselected"></div>//用于当前默

点击select下拉框获取option的属性值

select下拉框作为前端开发者应该是经常使用的,最近在项目中遇到这样的情况,点击下拉框选项,需要获取所点击的option的属性值,当时想很简单啊,给option加一个点击事件不就行了,然后就加了一下,结果一运行悲催了,怎么点击option事件就是不会执行.这是为什么呢,刚开始也不懂,之前没遇到过这样的需求,后来经过学习,才恍然大悟,原来select option没有点击事件,要想获得所选option的属性值,需要通过jquery的change()方法来获取,下面通过代码解释一下,代码如下: <