jqueryEasyUI之ComboBox(下拉列表框)

时间:2021-12-06 10:11:24

页面布局

<div class="col-md-4 col-sm-6 col-xs-12" style="display: none;" id="applybatchNameOne">
    <span style="display: inline-block;margin-left: 23px;">项&emsp;&emsp;目:</span>
    <input style="width: 210px;" id="applybatchName1" class="easyui-combobox select-width" data-options="
           prompt:'项目',
           valueField:'projectId',
           textField:'projectName',
           onChange:logistics.queryBatch,
           panelHeight:'auto',
           limitToList:true," />
</div>
<div class="col-md-4 col-sm-6 col-xs-12">
     <span style="display: inline-block">考试批次:</span>
     <input style="width: 210px;" id="applybatchName" class="easyui-combobox select-width" data-options="
            prompt:'考试批次名称',
            width:210,
            valueField:'batchId',
            textField:'batchName',
            onChange:logistics.searchBatches,
            panelHeight:'auto',
            limitToList:true," />
</div>
$.ajax({
url:'/logistics/'+logistics.loginuser.orginfo.id+'/projects',
type: "get",
dataType: "json",
success: function (data) {
var allOption = {
batchName: '全部',
batchId: ''
};
var dataPayload = data.payload;
dataPayload.unshift(allOption);
$("#applybatchName1").combobox('loadData', dataPayload);
$("#applybatchName1").combobox('setValue', "");
}
});

级联操作

logistics.queryBatch=function (newValue) {
    dataGridParams={'projectId':newValue}
    $.ajax({
        //url:'/logistics/3041f237a2674ad0be244d38d2f68362/projects',
        url:'/logistics/'+logistics.loginuser.orginfo.id+'/batches?projectId='+newValue,
        type: "get",
        dataType: "json",
        // data:parameter,
        success: function (data) {
            var allOption = {
                batchName: '全部',
                batchId: ''
            };
            var dataPayload = data.payload;
            dataPayload.unshift(allOption);
            $("#applybatchName").combobox('loadData', dataPayload);
            $("#applybatchName").combobox('setValue', "");
        }
    });
    logistics.listGrid();
}

获取下拉的值

$("#applybatchName").combobox('getValue');

获取下拉文本值

$("#applybatchName").combobox('getText');

设置下拉的值

$("#applybatchName").combobox('setValue',"xxx");

设置下拉文本值

$("#applybatchName").combobox('setText',"xxx");