EasyUI EasyUI combogrid 組合框使用

1.開啟分頁、 兩個組合框級聯、選中賦值等功能

    <select class="easyui-combogrid" id="clientls" style="width:200px" data-options="
                    panelWidth: 500,
                    idField: 'ID',
                    textField: 'ClientCode',
                    url: 'GetSelectClientList',
                    method: 'get',
                    pagination : true,
                    rownumbers:true,
                    collapsible:false,
                    pageSize: 10,
                    pageList: [10],
                    columns: [[
                        {field:'ID',title:'ID',width:80},
                        {field:'Stype',title:'賬套',width:80},
                        {field:'ClientCode',title:'客戶編號',width:80,align:'right'},
                        {field:'ClientName',title:'客戶名稱',width:80,align:'left'}
                    ]],
                    fitColumns: true,
                    onSelect : function(rowIndex, rowData) {$('#Stype').textbox('setValue', rowData.Stype);$('#ClientCode').combogrid('grid').datagrid('options').queryParams.filter = $('#clientls').textbox('getText');$('#ClientCode').combogrid('grid').datagrid('reload');},
                    labelPosition: 'top'"></select>



                        <select class="easyui-combogrid" id="ClientCode" style="width:200px" data-options="
                    panelWidth: 800,
                    idField: 'ID',
                    textField: 'SendAddress',
                    url: 'GetSelectClientList' ,
                    method: 'get',
                    pagination : true,
                    rownumbers:true,
                    collapsible:false,
                    pageSize: 10,
                    pageList: [10],
                    columns: [[
                        {field:'ID',title:'ID',width:50},
                        {field:'Stype',title:'賬套',width:30},
                        {field:'ClientCode',title:'客戶編號',width:80,align:'left'},
                        {field:'SendAddress',title:'送貨地址',width:350,align:'left'},
                        {field:'SendName',title:'送貨抬頭',width:250,align:'left'},
                        {field:'SendNameSub',title:'送貨子抬頭',width:250,align:'left'},
                        {field:'InvoiceName',title:'發票抬頭',width:80,align:'left'}
                       ]],
                    onSelect : function(rowIndex, rowData) {$('#Stype').textbox('setValue', rowData.Stype);$('#clientls').textbox('setValue', rowData.ClientCode);$('#SendName').textbox('setValue', rowData.SendName);$('#SendNameSub').textbox('setValue', rowData.SendNameSub);$('#InvoiceName').textbox('setValue', rowData.InvoiceName);},
                    labelPosition: 'top'"></select> 

//設置篩選條件。可用於上下級聯動。

$('#ClientCode').combogrid('grid').datagrid('options').queryParams.filter = $('#clientls').textbox('getText');$('#ClientCode').combogrid('grid').datagrid('reload')

 

onSelect事件設置選中后賦值、  級聯動。注意調用api 最好返回string 格式json