标签:style http os io 使用 java ar for 数据
<input name="test" type="hidden" id="userSelect" style="width: 600px" value="上海^漳州" />
$(‘#userSelect‘).select2({ placeholder : "请输入", minimumInputLength : 1, multiple : true, separator : "^", // 分隔符 maximumSelectionSize : 5, // 限制数量 initSelection : function (element, callback) { // 初始化时设置默认值 var data = []; $(element.val().split("^")).each(function () { data.push({ id: this, text: this }); }); callback(data); }, createSearchChoice : function(term, data) { // 创建搜索结果(使用户可以输入匹配值以外的其它值) return { id: term, text: term }; }, formatSelection : function (item) { return item.id; }, // 选择结果中的显示 formatResult : function (item) { return item.id; }, // 搜索列表中的显示 data: { results: [ { id: "北京", text: "bj beijin 北京" }, { id: "厦门", text: "xm xiamen 厦门" }, { id: "福州", text: "fz fuzhou 福州" } ] } });
$(‘#userSelect‘).select2({ placeholder : "请输入", minimumInputLength : 1, multiple : true, separator : "^", // 分隔符 maximumSelectionSize : 5, // 限制数量 initSelection : function (element, callback) { // 初始化时设置默认值 var data = []; $(element.val().split("^")).each(function () { data.push({id: this, text: this}); }); callback(data); }, createSearchChoice : function(term, data) { // 创建搜索结果(使用户可以输入匹配值以外的其它值) return { id: term, text: term }; }, formatSelection : function (item) { return item.id; }, // 选择结果中的显示 formatResult : function (item) { return item.id; }, // 搜索列表中的显示 ajax : { url : "test-api", // 异步请求地址 dataType : "json", // 数据类型 data : function (term, page) { // 请求参数(GET) return { q: term }; }, results : function (data, page) { return data; }, // 构造返回结果 escapeMarkup : function (m) { return m; } // 字符转义处理 } });
Route::get(‘test-api‘, function () { $q = Input::get(‘q‘); // do something ... return array( // ‘more‘ => false, ‘results‘ => array( array(‘id‘ => ‘北京‘, ‘text‘ => ‘bj beijin 北京‘), array(‘id‘ => ‘厦门‘, ‘text‘ => ‘xm xiamen 厦门‘), array(‘id‘ => ‘福州‘, ‘text‘ => ‘fz fuzhou 福州‘), ), ); });
自动完成下拉框 Select2 关键字搜索的实例(本地数据与异步获取)
标签:style http os io 使用 java ar for 数据
原文地址:http://my.oschina.net/5say/blog/311622