您的位置：首页 > Web前端 > 其它 > 正文

easyui combobox级联

更多时间：2015-1-18 类别：Web前端浏览量：3224

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 

     }); 

 });

标签：easyui

上一篇：easyui datebox的用法

下一篇：判断iframe是否加载完成

您可能感兴趣

easyui combobox级联

easyui combobox级联

热门推荐

排行榜