当前位置:Web前端 > 其它> 正文

easyui combobox级联

时间:2015-1-18类别:Web前端

easyui combobox级联

easyui combobox级联

一、创建combobox

 

有如下几种方式可以创建一个combobox

1、使用select标签,并加上class="easyui-combobox",这种方式比较适用于静态的选项。

2、使用input标签,并加上class="easyui-combobox",后面跟上data-options,可以用local或是remote方式加载数据。

3、使用js方式,和2基本相同,只是把combobox一些属性的设置分离到了js中。

 

二、easyui使用combobox实现级联的两种方式

 

1.将所有的数据通过json传传到客户端,在js中保存对象。然后通过筛选数据然后重新绑定其他几个combobox

2. 通过ajax来获取数据,重新加载。

 

  •  
  • 三、easyui使用combobox实现省市区级联
  •  
  •  
  •  
  • JScript 代码   复制
  • 
    
     $(function(){ 
    
         var province = $('#province').combobox({ 
    
             valueField:'areaid', 
    
             textField:'name', 
    
             editable:false, 
    
             url:'dateUrl', --需要异步获取数据的URL
    
             onSelect:function(params){ 
    
                 $.get('dateUrl',{parentid:params.areaid},function(data){ 
    
                     city.combobox("clear").combobox('loadData',data); 
    
                     county.combobox("clear") 
    
                 },'json'); 
    
             } 
    
         }); 
         
    
         var city = $('#city').combobox({ 
    
             valueField:'areaid', 
    
             textField:'name', 
    
             editable:false, 
    
             onSelect:function(params){ 
    
                 $.get('dateUrl',{parentid:params.areaid},function(data){ 
    
                     county.combobox("clear").combobox('loadData',data); 
    
                 },'json'); 
    
             } 
    
         }); 
    
         var county = $('#county').combobox({ 
    
             valueField:'areaid', 
    
             textField:'name', 
    
             editable:false 
    
         }); 
    
     }); 
    
    				
  •  

     

    标签:
    上一篇下一篇

    猜您喜欢

    热门推荐