BootStrap select2 动态改变值的方法


Posted in Javascript onFebruary 10, 2017

1,selec2动态赋值

var temp=JSON.stringify({ id: "1|所有停车场", name: "所有停车场" });
$("#e_pid").attr("value", tempP);
              $("#e_pid").select2({
                placeholder: "查找停车场名称(多选)",
                language: "zh-CN",
                minimumInputLength: 1,
                allowClear: true,
                multiple: true,
                ajax: {
                  // instead of writing the function to execute the request we use Select2's convenient helper
                  url: "/manage/park/index/json/index",
                  dataType: 'json',
                  data: function (term, page) {
                    return {
                      parkName: term,// search term
                      powerpid: "1"
                    };
                  },
                  results: function (data, page) { // parse the results into the format expected by Select2.
                    // since we are using custom formatting functions we do not need to alter remote JSON data
                    for (var i = 0; i < data.length; i++) {
                      data[i].id = data[i].id+"|"+data[i].name;
                    };
                    data.push({ id: "577cb125f8d2c404572413d1|无", name: "无" });
                    return {
                      results: data
                    };
                  }
                },
                initSelection: function (element, callback) {
//赋初始值
                  // the input tag has a value attribute preloaded that points to a preselected movie's id
                  // this function resolves that id attribute to an object that select2 can render
                  // using its formatResult renderer - that way the movie name is shown preselected
                  var data = [];
                  var value = ""
                  var str = $(element).val().split('^');
                  for (var i = 0; i < str.length; i++) {
                    var temp = JSON.parse(str[i]);
                    value += temp.id + ",";
                    data.push(temp);
                  }
                  ;
                  value = value.substring(0, value.length - 1);
                  $(element).val(value);
                  callback(data);
                },
                formatSelection: function (item) {
                  return item.name;//注意此处的name,要和ajax返回数组的键值一样
                }, // 选择结果中的显示
                formatResult: function (item) {
                  return item.name;//注意此处的name
                },// 搜索列表中的显示
                dropdownCssClass: "bigdrop", // apply css that makes the dropdown taller
                escapeMarkup: function (m) {
                  return m;
                }
              });

2,动态改变值                                             

$("#e_pid").attr("value", temp);
                          $("#e_pid").trigger('change'); //动态改变值以后必须触发改变时间。否则将不会生效

以上所述是小编给大家介绍的BootStrap select2 动态改变值的方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
javascript实现轮显新闻标题链接
Aug 13 Javascript
JS获取浏览器版本及名称实现函数
Apr 02 Javascript
不得不分享的JavaScript常用方法函数集(下)
Dec 25 Javascript
JS 实现倒计时数字时钟效果【附实例代码】
Mar 30 Javascript
基于jQuery实现中英文切换导航条效果
Sep 18 Javascript
前端面试知识点锦集(JavaScript篇)
Dec 28 Javascript
jQuery UI 实例讲解 - 日期选择器(Datepicker)
Sep 18 jQuery
Vue.js划分组件的方法
Oct 29 Javascript
ligerUI---ListBox(列表框可移动的实例)
Nov 28 Javascript
详解基于vue-cli配置移动端自适应
Jan 13 Javascript
jQuery实现的淡入淡出图片轮播效果示例
Aug 29 jQuery
JavaScript 如何在浏览器中使用摄像头
Dec 02 Javascript
angularjs实现的前端分页控件示例
Feb 10 #Javascript
用jQuery旋转插件jqueryrotate制作转盘抽奖
Feb 10 #Javascript
jQuery html表格排序插件tablesorter使用方法详解
Feb 10 #Javascript
简单的vue-resourse获取json并应用到模板示例
Feb 10 #Javascript
jQuery排序插件tableSorter使用方法
Feb 10 #Javascript
详解angularjs结合pagination插件实现分页功能
Feb 10 #Javascript
js仿QQ邮箱收件人选择与搜索功能
Feb 10 #Javascript
You might like
sony ICF-2010 拆解与改装
2021/03/02 无线电
php生成QRcode实例
2014/09/22 PHP
详解php与ethereum客户端交互
2018/04/28 PHP
PHP+MySQL实现模糊查询员工信息功能示例
2018/06/01 PHP
PHP设计模式之观察者模式定义与用法示例
2018/08/04 PHP
PHP实现的只保留字符串首尾字符功能示例【隐藏部分字符串】
2019/03/11 PHP
通过修改referer下载文件的方法
2008/05/11 Javascript
代码触发js事件(click、change)示例应用
2013/12/13 Javascript
jQuery实现回车键(Enter)切换文本框焦点的代码实例
2014/05/05 Javascript
移动端点击图片放大特效PhotoSwipe.js插件实现
2016/08/25 Javascript
让编辑器支持word复制黏贴、截屏的js代码
2016/10/17 Javascript
javascript实现获取图片大小及图片等比缩放的方法
2016/11/24 Javascript
在HTML文档中嵌入JavaScript的四种方法
2018/05/07 Javascript
Rollup处理并打包JS文件项目实例代码
2018/05/31 Javascript
vue.js基于v-for实现批量渲染 Json数组对象列表数据示例
2019/08/03 Javascript
微信小程序12行js代码自己写个滑块功能(推荐)
2020/07/15 Javascript
vue 重塑数组之修改数组指定index的值操作
2020/08/09 Javascript
python实现Adapter模式实例代码
2018/02/09 Python
Python实现将json文件中向量写入Excel的方法
2018/03/26 Python
python排序函数sort()与sorted()的区别
2018/09/18 Python
Python3.4学习笔记之常用操作符,条件分支和循环用法示例
2019/03/01 Python
Python3.5装饰器原理及应用实例详解
2019/04/30 Python
Python3自动生成MySQL数据字典的markdown文本的实现
2020/05/07 Python
python之openpyxl模块的安装和基本用法(excel管理)
2021/02/03 Python
一款css实现的鼠标经过按钮的特效
2014/09/11 HTML / CSS
小米旗下精品生活电商平台:小米有品
2018/12/18 全球购物
毕业生动漫设计求职信
2013/10/11 职场文书
岗位职责的构建方法
2014/02/01 职场文书
统计岗位职责
2014/02/21 职场文书
实习会计求职自荐信范文
2014/03/10 职场文书
《新型玻璃》教学反思
2014/04/13 职场文书
乐观自信演讲稿范文
2014/05/21 职场文书
教师节学生演讲稿
2014/09/03 职场文书
2014年高二班主任工作总结
2014/12/16 职场文书
2015年国庆节慰问信
2015/03/23 职场文书
Windows Server 2012配置DNS服务器的方法
2022/04/29 Servers