如何解决防止使用select2插件v4重新加载数据
由于您正在使用select2_v.4,因此必须使用data-
adapters
(query
并且initSelection
方法在V.4.0中已弃用)以下是custom-data-
adapter
通过名为方法使用的示例AMD-Pattern
。我没有机会进行测试,但是我相信这会为您提供继续前进的方向。
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/css/select2.min.css" rel="stylesheet" />
<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.4.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/js/select2.full.min.js"></script>
<script>
var cachedData;
$.fn.select2.amd.define('select2/data/customAdapter', ['select2/data/array', 'select2/utils'],
function (ArrayAdapter, Utils) {
function CustomDataAdapter($element, options) {
CustomDataAdapter.__super__.constructor.call(this, $element, options);
}
Utils.Extend(CustomDataAdapter, ArrayAdapter);
CustomDataAdapter.prototype.query = function (params, callback) {
var retData;
if (cachedData != undefined) // check if data existing in cachedData variable
retData = cachedData;
else {
$.ajax({
url: url,
dataType: 'json',
quietMillis: 250,
data: function (params) {
return {
term: params.term,
page: params.page,
page_limit: default_page_size
};
},
success: function (data) {
retData = {
results: data.data,
pagination: {
more: (data.page * default_page_size) < data.count
}
};
cachedData = retData; // save the retData in a global variable
},
error: function (er) {
debugger;
},
cache: true
});
}
callback(retData);
};
return CustomDataAdapter;
}
);
$(document).ready(function () {
var customAdapter = $.fn.select2.amd.require('select2/data/customAdapter');
$("#select1").select2({
tags: true,
dataAdapter: customAdapter,
escapeMarkup: function (markup) {
return markup;
},
minimumInputLength: 0,
templateResult: formatTemplateResult,
templateSelection: formatTemplateSelection
});
});
</script>
解决方法
我正在使用select2插件(v4),并使用ajax加载他的选项。
如果我第一次打开选择输入,将加载数据。当我再次打开选择时,将重新加载相同的数据。
有什么方法可以防止这种“重新加载”数据?我的意思是,如果我只是打开select2并且先前已加载选项,则我不想再次加载。
这是我当前的代码:
$(select_input).select2({
ajax: {
url: url,dataType: 'json',quietMillis: 250,data: function (params) {
return {
term: params.term,page: params.page,page_limit: default_page_size
};
},processResults: function (data) {
return {
results: data.data,pagination: {
more: (data.page * default_page_size) < data.count
}
};
},cache: true
},escapeMarkup: function (markup) {
return markup;
},minimumInputLength: 0,templateResult: formatTemplateResult,templateSelection: formatTemplateSelection
});
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。