ligerui 实现二级联动代码简单

原创于 2017-10-27 11:23:09 发布 · 2k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#两级联动二级联动 #ligerui

java 专栏收录该内容

4 篇文章

订阅专栏

本文介绍使用LigerUI框架实现地区与片区的二级联动功能。通过Ajax请求获取数据，并利用onSelected回调更新下拉框内容，实现了动态联动效果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

运维别人开发的功能 ,发现应用了ligerui 框架，我们的需求是实现地区与片区的二级联动：代码如下

org_from_area_id = $("#org_from_area_id").ligerComboBox(
                        { url: "${pageContext.request.contextPath}/admin/orgArea.do?findOrgAreaByUsed" ,
                            valueField:'org_from_area_id',
                            textField:'org_from_area_desc',
                      onSelected: function (id) {  
                      
                        $.ajax({  
                            url: '${pageContext.request.contextPath}/report/getdspaylist.do?getRangeList&id='+id,  
                           
                            success: function(data){  
                                data = eval('(' + data + ')');  
                               
                                liger.get('rand_id').setData(data);  
                                //level = lev;  
                            }  
                        });  
                     
                },  
                onButtonClick: function () {  
                    classes = null;  
                }  
            });  
 
            $("#rand_id").ligerComboBox({       
                data: null,                   
               // valueFieldID: 'chooceClass',   
                  valueField:'ran_id',
                textField:'ran_desc',
                })

html 代码：

<td> 奶源地区 </td>
            <td> <input type="text"  name="org_from_area_id" id="org_from_area_id" width="100"/> </td>
            <td> 片区 </td>
            <td> <input type="text"  name="rand_id" id="rand_id" width="100"/> </td>