select2 的加載遠程數據

select2 加載遠程數據的代碼以下:ajax

function initGlfl() {
        var mapping = document.getElementById("zj").value;
        $("#glfl").select2(
                        {
                            placeholder : "請選擇內容",//文本框的提示信息  
                            minimumInputLength : 0, //至少輸入n個字符,纔去加載數據  
                            allowClear : true, //是否容許用戶清除文本信息  
                            ajax : {
                                url : "${ctx}/group/odsGbt4754Mapping/getFieldLst?mapping="
                                        + mapping, //地址  
                                dataType : 'text', //接收的數據類型  
                                // type: "POST",
                                //contentType:'application/json',  
                                data : function(term, pageNo) { //在查詢時向服務器端傳輸的數據  
                                    term = $.trim(term);
                                    return {
                                        autNumber : term, //聯動查詢的字符  
                                        pageSize : 15
                                    //一次性加載的數據條數  json

                                    }
                                },
                                results : function(data) {
                              
                                    if (data.length > 0) { //若是沒有查詢到數據,將會返回空串  
                                        var dataObj = eval("(" + data + ")"); //將接收到的JSON格式的字符串轉換成JSON數據  
                                        var more = (1 * 15) < dataObj.total; //用來判斷是否還有更多數據能夠加載  
                                        return {
                                            results : dataObj.result,
                                            more : more
                                        };
                                    } else {
                                        return {
                                            results : data
                                        };
                                    }
                                }
                            },
                            initSelection : function(element, callback) {
                                //初始化,其中doName是自定義的一個屬性,用來存放text的值  
                                var id = $(element).val();      
                                if (id==glflId) {
                                    callback({
                                        id : glflId,
                                        text : glflText
                                    });
                                }
                            } 
                        // formatResult: formatAsText  //渲染查詢結果項  
                        });
 服務器

須要注意的點:初始化方法  initSelection : function(element, callback)  會由$("#glfl").val(glflId).trigger("change");觸發,後執行callback 方法,app

若是想取消觸發初始化方法則用:$("#glfl").val(null).trigger("change");ui

 

另外select2 標籤訂義爲:<input id="glfl" name="glfl" class="input-medium" />url

 

select2 取 text 值的方法orm

function convertText(sid){
        var obj= $(sid).select2('data');
           var tValue ="";
           if(obj!=null){
               tValue = obj.text;
           }
           return tValue;
    }element

 

select2 ,取id值的方法字符串

 $(sid).val() get

 

後臺的方法返回數據格式

@RequiresPermissions("user")
    @ResponseBody
    @RequestMapping(value = "getFieldLst")
    public Object getFieldLst(@RequestParam(value="mapping") String mapping) {
        //List<Map<String, Object>> mapList = Lists.newArrayList();
        String category = DictUtils.getDictLabel(mapping,
                "jcfx_field_category", null);
        OdsGbt4754Mapping odsGbt4754Mapping = new OdsGbt4754Mapping();
        odsGbt4754Mapping.setMapping(category);
        List<OdsGbt4754Mapping> list = odsGbt4754MappingService.findFields(odsGbt4754Mapping);
        List<Map<String,String>> mLst = new ArrayList<Map<String,String>>();
        for (OdsGbt4754Mapping o: list){
            Map<String, String> map = new HashMap<String, String>();
            map.put("id", o.getCode());
            map.put("text", o.getCodeValue());
            mLst.add(map);
        }
        JSONArray jsonArray = JSONArray.fromObject(mLst);

        JSONObject user_json = new JSONObject();
        user_json.put("total", list.size());

        user_json.put("result", jsonArray);
        String s = user_json.toString();

        return s;              }

相關文章
相關標籤/搜索