ligerComboBox 下拉框控件

本文介绍了如何在HTML页面中引入ligerUI库,并使用ligerComboBox创建下拉框控件。详细说明了js、css的引入方式,以及控件的配置参数,如data、textField、valueField、valueFieldID和value。还提到了注意事项,如html的id与控件的valueFieldID不能相同,以及解决异步加载数据时可能出现的null文本问题。

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

 

引入js、css:

<link href="${ctx}/static/comp/ligerUI/skins/Aqua/css/ligerui-all.css" rel="stylesheet" type="text/css" />

<script src="${ctx}/static/comp/ligerUI/js/core/base.js" type="text/javascript"></script>

<script src="${ctx}/static/comp/ligerUI/js/plugins/ligerComboBox.js" type="text/javascript"></script>

<script src="${ctx}/static/comp/ligerUI/js/plugins/ligerTree.js" type="text/javascript"></script>

html:

<input type="text" class="txt1" id="sexId" />

 

js:

$("#sexId").ligerComboBox({

data: [{ id: 1, name: '男' },{ id: 2, name: '女' }],

textField: 'name', 

valueField :'id',

valueFieldID:'sex',

value:1

});

说明:

data:json数据 

textField:要显示的字段 key

valueField :要提交的值的 key

valueFieldID:要提交时的name 对应的名称

value:默认值 与valueField相对应

 

注意:

  html的input标签的id  sexId 不能与控件的valueFieldID属性值相同,否则请求400

 

实例:

 $("#PROTOCAL_ID").ligerComboBox({

    url:path+'/common/protocolTypeCombobox?isAll=false',

        textField: 'name',

        valueField: 'code',

        valueFieldID: 'protocalId',

        value:"${device.protocalId}"

 

    });

清空 input框中的value(sexId为input的ligerComboBox 对象

sexId.setValue(""); 

异步树加载数据的时候 ,有时默认input会出现 null文本:
解决:源码ligerComboBox.js 

 

 //设置值到 文本框和隐藏域

        _changeValue: function (newValue, newText)

{

            var g = this, p = this.options;

            g.valueField.val(newValue);

            if (p && p.render)

{

                g.inputText.val(p.render(newValue, newText));

            }

            else

{                   //添加

           if(newText == null || newText == "null"){

                newText="";

                }

                g.inputText.val(newText);

            }

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值