easy ui datagrid 下拉框级联绑定

function loadDataList() {
var lastIndex;
var $dg = $('#data_list');
$dg.datagrid({
height: 'auto',
singleSelect: true,
idField: 'DeliveryDetailID',
columns: [[
{
field: 'DeliveryDetailID',
title: 'ID',
width: 10,
hidden: true
},
{
field: 'DataSourceID',
title: '来源单据ID',
width: 10,
hidden: true
},
{
field: 'DataSourceType',
title: '数据来源',
width: 10,
hidden: true
},
{
field: 'DataSourceTypeName',
title: '数据来源',
width: 80
},
{
field: 'DataSourceNo',
title: '系统单号',
width: 100
},
{
field: 'SystemNo',
title: '手工单号',
width: 100
},
{
field: 'DepotID',
title: 'DepotID',
width: 10,
hidden: true
},
{
field: 'DepotName',
title: '仓库',
width: 80
},
{
field: 'ClientID',
title: '客户ID',
width: 10,
hidden: true
},
{
field: 'ClientNo',
title: '客户No',
width: 10,
hidden: true
},
{
field: 'ClientName',
title: '客户名称',
width: 100
},
{
field: 'TransitContactType',
title: '收货人类别',
width: 80,
formatter: function (value) {
for (var i = 0; i < gTransitContactType.length; i++) {
if (gTransitContactType[i].id == value) return gTransitContactType[i].text;
}
return value;
},
editor: {
type: 'combobox',
options: {
valueField: 'id',
textField: 'text',
data: gTransitContactType,
required: true
}
}
},
{
field: 'DeliveryType',
title: '发运方式',
width: 80,
formatter: function (value) {
for (var i = 0; i < gDeliveryType.length; i++) {
if (gDeliveryType[i].id == value) return gDeliveryType[i].text;
}
return value;
},
editor: {
type: 'combobox',
options: {
valueField: 'id',
textField: 'text',
data: gDeliveryType
}
}
},
{
field: 'TransitProvinceID',
title: '省',
width: 80,
formatter: function (value) {
for (var i = 0; i < gTransitProvince.length; i++) {
if (gTransitProvince[i].id == value) return gTransitProvince[i].text;
}
return value;
},
editor: {
type: 'combobox',
options: {
valueField: 'id',
textField: 'text',
data: gTransitProvince,
required: true,
onChange: function (newValue, oldValue) {
//重点在此处
//先获取到当前选中行
//根据当前行获取，当前行的下标
//在根据下标和要获取列的filed获取对应filed的Editor对象
//而后在根据对应的Editor操做
var cityData = '[';
for (var i = 0; i < gTransitCity.length; i++) {

if (gTransitCity[i].ProvinceID == newValue) {

cityData += '{\"id\":\"' + gTransitCity[i].id + '\",\"text\":\"' + gTransitCity[i].text + '\"},';
}
}
cityData = cityData.substr(0, cityData.length - 1);
cityData += "]";

var row = $dg.datagrid('getSelected');
var rindex = $dg.datagrid('getRowIndex', row);
var ed = $dg.datagrid('getEditor', {
index: rindex,
field: 'TransitCityID'

});

var data = $.parseJSON(cityData);

$(ed.target).combobox('loadData', data);

$(ed.target).combobox('setValue', data[0].text);
}
}
}
},
{
field: 'TransitCityID',
title: '市',
width: 80,
formatter: function (value) {
for (var i = 0; i < gTransitCity.length; i++) {
if (gTransitCity[i].id == value) return gTransitCity[i].text;
}
return value;
},
editor: {
type: 'combobox',
options: {
valueField: 'id',
textField: 'text',
required: true
}
}
},
{
field: 'TransitAddress',
title: '地址',
width: 250,
editor: {
type: 'textbox',
}
},
{
field: 'DeliveryArea',
title: '所属区域',
width: 50,
formatter: function (value) {
for (var i = 0; i < gDeliveryArea.length; i++) {
if (gDeliveryArea[i].id == value) return gDeliveryArea[i].text;
}
return value;
},
editor: {
type: 'combobox',
options: {
valueField: 'id',
textField: 'text',
data: gDeliveryArea,
required: true
}
}
},
{
field: 'TransitContactName',
title: '联系人',
width: 80
},
{
field: 'TransitContactTel',
title: '联系电话',
width: 80
},
{
field: 'TotalAddress',
title: '收货地址',
width: 10,
hidden: true
},
{
field: 'ConDealerID',
title: '委托单位',
width: 10,
hidden: true
},
{
field: 'ConDealerName',
title: '委托单位',
width: 80
},
{
field: 'BalanceDealerID',
title: '结算单位',
width: 10,
hidden: true
},
{
field: 'BalanceDealerName',
title: '结算单位',
width: 80,
required: true
},
{
field: 'TotalQty',
title: '商品总数量',
width: 80
},
{
field: 'TotalVolume',
title: '整体积',
width: 80
},
{
field: 'Remark',
title: '备注',
width: 200
}

]],
onBeforeLoad: function () {
$(this).datagrid('rejectChanges');
},
onClickRow: onClickRow
});
}