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笔记一 js以及json基础使用说明
May 22 Javascript
autoPlay 基于jquery的图片自动播放效果
Dec 07 Javascript
JQuery 中几个类选择器的简单使用介绍
Mar 14 Javascript
jQuery实现类似滑动门切换效果的层切换
Sep 23 Javascript
jquery.mobile 共同布局遇到的问题小结
Feb 10 Javascript
jQuery调用ajax请求的常见方法汇总
Mar 24 Javascript
javascript截取字符串小结
Apr 28 Javascript
JavaScript简单修改窗口大小的方法
Aug 03 Javascript
详解Vue组件之间的数据通信实例
Jun 17 Javascript
使用Vue做一个简单的todo应用的三种方式的示例代码
Oct 20 Javascript
vue实现图片上传功能
May 28 Javascript
JavaScript实现刮刮乐效果
Nov 01 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
自动跳转中英文页面
2006/10/09 PHP
php中比较简单的导入phpmyadmin生成的sql文件的方法
2011/06/28 PHP
thinkphp实现like模糊查询实例
2014/10/29 PHP
Thinkphp+smarty+uploadify实现无刷新上传
2015/07/30 PHP
PHP中Socket连接及读写数据超时问题分析
2016/07/19 PHP
PHP的介绍以及优势详细分析
2019/09/05 PHP
List all the Databases on a SQL Server
2007/06/21 Javascript
JavaScript取得鼠标绝对位置程序代码介绍
2012/09/16 Javascript
js控制分页打印、打印分页示例
2014/02/08 Javascript
javaScript中两个等于号和三个等于号之间的区别介绍
2014/06/27 Javascript
JavaScript使用indexOf获得子字符串在字符串中位置的方法
2015/04/06 Javascript
JavaSciprt中处理字符串之sup()方法的使用教程
2015/06/08 Javascript
KnockoutJS 3.X API 第四章之事件event绑定
2016/10/10 Javascript
es6学习笔记之Async函数的使用示例
2017/05/11 Javascript
基于Bootstrap框架菜鸟入门教程(推荐)
2017/09/17 Javascript
vue mounted组件的使用
2018/06/18 Javascript
解决bootstrap中下拉菜单点击后不关闭的问题
2018/08/10 Javascript
JQuery Ajax执行跨域请求数据的解决方案
2018/12/10 jQuery
在vue项目中引入highcharts图表的方法
2019/01/21 Javascript
详解JS浏览器事件循环机制
2019/03/27 Javascript
jQuery实现动态加载瀑布流
2020/09/01 jQuery
[31:01]2014 DOTA2国际邀请赛中国区预选赛5.21 CNB VS Orenda
2014/05/23 DOTA
[01:03:27]NAVI vs EG 2019国际邀请赛小组赛 BO2 第一场 8.15
2019/08/17 DOTA
Python多进程同步简单实现代码
2016/04/27 Python
Django实战之用户认证(初始配置)
2018/07/16 Python
Python OpenCV对本地视频文件进行分帧保存的实例
2019/01/08 Python
Python利用Xpath选择器爬取京东网商品信息
2020/06/01 Python
使用Python下载抖音各大V视频的思路详解
2021/02/06 Python
苹果香港官方商城:Apple香港
2016/09/14 全球购物
化学学院毕业生自荐信范文
2013/12/17 职场文书
2014党委书记四风对照检查材料思想汇报
2014/09/21 职场文书
关于运动会广播稿300字
2014/10/05 职场文书
大学生档案自我鉴定(2篇)
2014/10/14 职场文书
舞出我人生观后感
2015/06/16 职场文书
班级联欢会主持词
2015/07/03 职场文书
Go语言特点及基本数据类型使用详解
2022/03/21 Golang