easyui combox

附:easyui 文档连接-http://www.jeasyuicn.com/api/docTtml/index.htm

1,静态数据,可直接通过data传递json (text-显示值 value-后台实际值)

 <input id="bayonetid" name="bayonetid" 
                         class="easyui-combobox search-input"
                            data-options="
                                    valueField:'value',
                                    textField:'text',
                                    panelHeight:'auto',
                                    data: [{
                                        text: '全部',
                                        value: ''
                                    }]"/>
                    </td>

2,动态数据,后台取数据

　　a:后台定义json返回格式(直接将CombOption  list 转化为json返回即可)

public class CombOption extends BaseDto {
    private String text;
    private String value;
    private boolean checked;
//getter and setter
}

 

valueField,textField 分别与后台json数据的text,value对应

<input class="easyui-combobox search-input"
                            name="carWayCode"
                            data-options="
                                    url:'${contextPath}/sys/param/combParams.do?typeCode=1001',
                                    method:'get',
                                    valueField:'value',
                                    textField:'text',
                                    panelHeight:'auto'"/>

3,联动下拉框

------选择单位名称 根据选择值 变换 点位名称可选值

<td><label>单位名称:</label></td>
                    <td>
                        <input name="areaid" id="areaid" />
                    </td>

                    <td><label>点位名称:</label></td>
                    <td>
                     
                     <input id="bayonetid" name="bayonetid" 
                         class="easyui-combobox search-input"
                            data-options="
                                    valueField:'value',
                                    textField:'text',
                                    panelHeight:'auto',
                                    data: [{
                                        text: '全部',
                                        value: ''
                                    }]"/>
                    </td>

            //区域 卡口 联动选择框
            var combJson =  [{ "value":"", "text":"全部"  }];
            
                $("#areaid").combobox({   
                    url:'${contextPath}/sys/param/combParams.do?typeCode=1008',
                    method:'get',
                    valueField:'value',
                    textField:'text',
                    panelHeight:'auto',
                    onSelect: function(rec){
                        $('#bayonetid').combobox('clear');
　　　　　　　　　　　　　　　　//areaid rec.value 为所选值
                        if(rec.value==''){
                            
                            $('#bayonetid').combobox('loadData',combJson);
                        }else{
                            var url ='${contextPath}/sys/param/combParams.do?typeCode=1009&pcode='+rec.value;
                            $('#bayonetid').combobox('reload',url);
                        }
                       }
                  });