easyui下拉列表级联操作,加载完毕后自动默认加载第一项的下级菜单

发布时间:2020-07-10 16:53:57 作者:pannijingling
来源:网络 阅读:1066
1.html代码:
<td width="80px;">科目名称:</td>
<td >
        <select id="accountitem" name="accountitem" class="easyui-combobox"  data-options="editable:false,panelHeight:'auto',
        onSelect: function(){getAccountnameList();},onLoadSuccess : function(){getAccountnameList();}">
                        <option value="01">2013第一季度</option>
                        <option value="02">2013第二季度</option>
                        <option value="03">2013第三季度</option>
        </select>
</td>
<td>账户名称:</td>
<td >
        <select id="accountname" name="accountname" class="easyui-combobox"   data-options="editable:false,panelHeight:'auto'"></select>
</td>
2.js代码
/* 动态加载账户名称 */
function getAccountnameList(){
     //获取下拉列表的选项值
     var id = $("#accountitem").combobox("getValue");  
     $('#accountname').combobox({
                url: '${ctx}/oa/fdr/accountnameList?id='+id,
                valueField: 'id',        //id是返回json字符串中的key,对应下拉列表值
                textField: 'name',     //name是返回json字符串中的key,对应下拉列表显示文本
                onLoadSuccess : function(record){
                        //默认选中第一项
                        $('#accountname').combobox('setValue',record[0].id); 
                 }
        });
        getCapitalsummary();
};
//json数据如下:
[{"group":"","id":"cwzhnhfsy","name":"农行","selected":true},
{"group":"","id":"cwzhnhpos","name":"工行","selected":false},
{"group":"","id":"cwzhjhlzl","name":"建行","selected":false},
{"group":"","id":"cwzhjnpos","name":"POS机","selected":false}]

/* 动态加载期初余额 */
function getCapitalsummary(){
        var accountname = $("#accountname").combobox("getValue");
        $.post('${ctx}/oa/fdr/capitalsummary',{accountname:accountname},function(data){
                //使用jquery动态给easyui-numberbox赋值
                $("#beginningbalance").numberbox('setValue', data.beginningbalance);
        },'json');
};
//json数据如下:
{"beginningbalance":0,"incomeamount":0,"spendingamount":0}
推荐阅读:
  1. jquery easyui中easyLoader加载器怎么用
  2. 使用 ng-options 指令,加载下拉列表

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

easyui 下拉列表 级联操作

上一篇:浅谈 粒子动画 特效的实现

下一篇:mysql属于什么类型的数据库

相关阅读

您好,登录后才能下订单哦!

密码登录
登录注册
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》