select2框架怎么接受ajax参数
时间: 2023-11-14 11:03:29 浏览: 41
select2框架是一个基于jQuery的下拉选择框插件,它支持从远程数据源加载选项,并且可以进行筛选和搜索。要使用ajax参数,可以在select2的初始化代码中设置ajax属性,该属性应该是一个对象,包含url、dataType、data等属性。以下是一个简单的示例代码:
```
<select class="js-example-basic-single" name="state">
<option value="AL">Alabama</option>
<option value="WY">Wyoming</option>
</select>
<script>
$(document).ready(function() {
$('.js-example-basic-single').select2({
ajax: {
url: 'https://example.com/api/states',
dataType: 'json',
delay: 250,
data: function (params) {
return {
q: params.term, // search term
page: params.page
};
},
processResults: function (data, params) {
// parse the results into the format expected by Select2
// since we are using custom formatting functions we do not need to
// alter the remote JSON data, except to indicate that infinite
// scrolling can be used
params.page = params.page || 1;
return {
results: data.items,
pagination: {
more: (params.page * 30) < data.total_count
}
};
},
cache: true
},
placeholder: 'Select a state'
});
});
</script>
```
在这个例子中,我们通过ajax属性设置了一个远程数据源,该数据源的URL为'https://example.com/api/states',数据类型为json,延迟为250毫秒,数据参数为params.term和params.page。我们还定义了一个processResults回调函数,用于将远程数据解析成Select2能够识别的格式。最后,我们在select2的初始化代码中设置了一个占位符,用于显示在下拉列表中。