select2 ajax获取数据设置默认值,初始值

select2是一个非常好用的select美化插件，但是在最近使用时发现，select2在使用ajax获取数据内容时设置默认值非常麻烦，官方给出了一个解决方案就是添加一个属性selected的option：

如果select的value值和text都已知的情况下，这种解决方案使用起来就非常容易而且好用了。

但是在实际使用中如果要使用ajax来获取数据，如果select的value值和text不相同的时候，通常只知道value值，在这种情况下使用这种解决方案就非常麻烦了，百度了很多方案都打不到想要的效果，甚至有人提出进行两次ajax，第一次ajax方式设置select2，第二次ajax请求默认数据设置select2的默认值，这样就增加了将近一倍的开销，划不来。

冥思苦想半天，还是没明白select2官方设计ajax方式获取数据时的初衷（mmp）,找了一下select2的源码，内心再次奔溃，卧槽，好多行代码，赶紧放弃（其实就是没看懂，mmp again）,还是自己动手丰衣足食，换一种思维，select2数据源有两种类型，一种是数组arrays，另一种就是ajax远程数据，

所以在这里使用数组和ajax结合的方式，先使用ajax获取数据数组，同时将默认值传入后台，在返回数据的时候带上这个默认值，接下来设置select2的选择值，然后设置默认值就非常简单了，这也是各种情况下，设置select2默认值的方法：

$("xxx").val(val).trigger("change");

最后贴一下完整代码：

再补充一下ajax设置select2的返回数据格式要求：

------------------ 结束 ----------------

select2 ajax获取数据设置默认值,初始值相关推荐

vue定时ajax获取数据,vue 中使用 AJAX获取数据的方法
在VUE开发时,数据可以使用jquery和vue-resource来获取数据.在获取数据时,一定需要给一个数据初始值. 看下例: new Vue({ el:'#app', data:{data:&qu ...
vue 读取ajax数据,详解vue 中使用 AJAX获取数据的方法
在VUE开发时,数据可以使用jquery和vue-resource来获取数据.在获取数据时,一定需要给一个数据初始值. 看下例: new Vue({ el:'#app', data:{data:&qu ...
BOS项目02_02_zTree-通过ajax的获取菜单数据、监听树形菜单的点击事件、读取json文件、Ajax获取数据
系列文章目录文章目录系列文章目录前言一.发送ajax网络请求获取菜单数据二.监听树形菜单的点击事件总结前言一.发送ajax网络请求获取菜单数据我们现在的数是写死的,那么实际项目中我们 ...
MySQL设置自增初始值和步长
我这里使用的为Navicat: (一般设置特殊的自增值和自增步长是为了:当数据出现错乱时,我们需要将备份的数据和线上的数据进行比对时使用.) 我们可以通过:SHOW VARIABLES LIKE 'a ...
(vue)在ajax获取数据时使用loading组件不起作用
问题描述: 在用ajax获取数据时页面没有变化,想用一个loading图标在获取数据时显示,获取完成后隐藏整个系统用到了vue框架,在执行sure方法时调用ajax函数 sure() {conso ...
Chart.js使用及ajax获取数据
图表插件Chart.js使用插件简介安装插件简介 chart.js是一个优秀的开源图表处理插件,内置条形,折现,雷达,时间刻度等等图表渲染. 安装 chart.js官网. 我这里使用2019年3 ...
【四二学堂】jquery方式ajax获取数据并渲染页面
var newsData = ''; var mydata = {"pageNum":obj.curr,"pageSize":"5"}; / ...
自己做一个table插件 (一)Ajax获取数据后动态生成table
今天我给大家带来一个简单的JQ插件,Ajax获取数据后动态生成table.当然,有这种功能的插件有很多.著名的有DataTable.JqGrid--它们虽然功能丰富,成熟,拿来做二次开发是一个不错的选 ...
Datatables学习（二）ajax获取数据
上一篇文章,讲解了datatables的基本创建,这一讲讲解datatables通过ajax异步获取数据 1.前提准备以一个图书管理的表格为例,后台java代码就不细说了,这里主要讲解前端数据库表 ...

select2 ajax获取数据设置默认值,初始值

select2 ajax获取数据设置默认值,初始值相关推荐

最新文章

热门文章