Easy ui Combobox,easy ui datagrid Combobox



一:设置默认值

   var myloaderQYPort = function (param, success, error) {
        $.ajax({
            type: "post",
            url: '/Home/GetStartPortByKey',
            data: { key: $('#BEGIN_NAME').combogrid('getValue') },
            success: function (data) {
                var items = $.map(data, function (item) {
                    return {
                        Value: item.PortNameEN,
                        Name: item.PortNameCN
                    };
                });
                $('#BEGIN_NAME').combogrid('setValue', "SHANGHAI");//选中默认值
                success(items);
            }
        });

    }


二:选中默认值

<th  data-options="field:'DepartmentId',width:80,
                                  formatter:function(value,row){ 
                                   return row.DepartmentName;
                                  },
                                  editor:{
                                  type:'combobox',
                                  options:{
                                   valueField:'id',
                                   textField:'DepartmentName',
                                   url:'/UsersManage/Department/GetDepartmentForC',
                                   editable:false,
                                   onLoadSuccess:function()
                                   {                      
                                         var myvalue = $(this).combobox('getValue');
                                         if(myvalue == '' || myvalue==null )
                                         {                       
                                           var data = $(this).combobox('getData');
                                           $(this).combobox('select',data[0].id);
                                         }
                                   }                                    
                                  }
                             }">部门名称</th>

$('#dncb').combobox('select', 此处放上id);


三:多选

他有一个属性 multiple="multiple",这个是支持多选的一个属性,获取他的方法在官方的api中能够找到,即:
$('#Id').combobox('getValues'),但是在为这个combobox赋值的时候简单的使用
$('#Id').combobox('setValues','1,2,3')这种方式是不行的,因为既然多选,他的值就是一个数组,所以在赋值的时候,要把后面的值转换数组,即$('#Id').combobox('setValues','1,2,3'.split(',')).

 主要在datagrid嵌套使用combobox多选的时候,combobox的value不要是int,

不然他会报找不到split方法的


四:easy ui datagrid 中嵌套的 Combobox联动效果

其实 easy ui datagrid Combobox和Combobox一样用就可以了,选择事件中去加载另外一个combobox的值就可以了

选择事件

onChange:loaderCompanyEditChnage

var loaderCompanyEditChnage = function (newValue, oldValue) {
            companyEn = newValue;

            //从datagrid获取到需要联动的combobox
            var data = $('#dg').datagrid('getData');
            var ed = $('#dg').datagrid('getEditor', { index: data.rows.length-1, field: 'UpSetType' });

            //获取数据然后用loadData填充数据
            var data = []; 
            $.ajax({
                type: "post",
                url: '/UpSetList/GetUpdateTypeByCompany',
                data: { _companyName: companyEn },
                success: function (resultdata) {

                  

                    $.each(resultdata, function (index, item) {
                        var invalue = {};
                        invalue.PortId = item.Name;
                        invalue.NameEN = item.Name;
                        data.push(invalue);
                    });                 
                    console.log(data);
                    if (ed != null) {
                        alert("进来赋值");
                        $(ed.target).combobox('loadData', data);
                    }
                }
            });

        }


五  easy ui datagrid  Combobox  使用loader加载数据

              options:{ 
                                mode: 'remote',
                                valueField:'PortId',
                                textField:'NameEN',
                                loader: loaderEdit,
                                editable:true                        
                            }

   

   var loaderEdit = function (param, success, error) {
            $.ajax({
                type: "post",
                url: '/UpSetList/GetUpdateTypeByCompany',
                data: { _companyName: companyEn },
                success: function (data) {
                    var items = $.map(data, function (item) {
                        return {
                            PortId: item.Name,
                            NameEN: item.Name,
                        };
                    });
                    success(items);
                }
            });
        }





评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值