设置datagrid列为下拉框

方式一：从远地动态获取数据

var operates = {
	getRowIndex: function (target) {
		var tr = $(target).closest('tr.datagrid-row');
		return parseInt(tr.attr('datagrid-row-index'));
	},
	addRow:function (index) {
		$(tableId).datagrid('insertRow', {
			index: index,
			row: {
			}
		});
		$(tableId).datagrid('selectRow', index);
		$(tableId).datagrid('beginEdit', index);
	}
	cancelRow:function (target) {
		$(tableId).datagrid('cancelEdit', operates.getRowIndex(target));
	},
	editRow: function (target) {
		$(tableId).datagrid('beginEdit', operates.getRowIndex(target));
	},
	saveRow: function (target) {
		$(tableId).datagrid('endEdit', operates.getRowIndex(target));
	}
}

function loadDruginfoPresList(tableId){
	$(tableId).datagrid({
		...
		columns:[[
			{field:'testOne',title:'testOne',width:50,align:'center',editor:{type:'text'}},
			{field:'testTwo',title:'testTwo',width:120,align:'center',
				editor:{
					type:'combogrid',options:{
						delay:500,                 //延迟5s
						required:true,             //是否为必填项
						multiple: true,            //可多选
						pannelWidth:120, 		   //下拉框宽度
						url:url,   			       //数据源地址
						showHeader:false,  		   //不显示下拉框标题
						prompt:'请输入', 		   //下拉框区域默认显示字段
						columns:[[
							{field:'name',title:'name',width:110,align:'center'}
						]],
						keyHandler:{
							query:function (q) {
							//当鼠标定位到数据框时，每5s拉取一次下拉框数据，test为数据框的值，作为传给数据源的参数
								$(this).combogrid("grid").datagrid("reload",{'test':q});
								$(this).combogrid("setValue",q);
							}
						},
						onShowPanel:function () {
							lastIndex=operates.getRowIndex(this); //正在编辑的行的索引
							$(this).combogrid("grid").datagrid("load");
						},
						onSelect:function(index,row){
							//获取field值为testTwo的列，行索引为lastIndex的编辑框对象
							var $testTwo=$(tableId).datagrid('getEditor',{index:lastIndex,field:"testTwo"});
							var $testOne=$(tableId).datagrid('getEditor',{index:lastIndex,field:"testOne"});
							//将获取到的数据的name字段赋值给$testTwo对象
							$($testTwo.target).combogrid("setValue",row.name);
							$($testOne.target).combogrid("setValue",row.id);
						}
					}
				}
			},
			{field: 'operate', title: 'operate', width: 100, align: 'center',
				formatter:function(value,row,index){
					var str="";
					if (row.editing) {
						str += "<a href=javascript:void(0); onclick=operates.saveRow(this)>保存</a>";
						str += "<a href=javascript:void(0); onclick=operates.cancelRow(this)>取消</a> ";
					} else {
						str += "<a href=javascript:void(0); onclick=operates.editRow(this)>修改</a> ";
						str += "<a href=javascript:void(0); onclick=operates.deleteRow(this)>删除</a> ";
					}
					return str;
				}
			}
		]],
		onLoadSuccess: function(data){
        },
		onBeforeEdit:function (index,row) {
            row.editing=true;
            $(tableId).datagrid('refreshRow',index);
        },
		onAfterEdit:function (index,row) {
            row.editing=false;
            $(tableId).datagrid('refreshRow',index);
        },
		onCancelEdit:function (index,row) {
            row.editing=false;
            $(tableId).datagrid('refreshRow',index);
        }
	});
}

注意：一般并不推荐上面的那种写法，因为每增加一行，就会重新发送一次ajax请求数据，因此推荐下面这种写法。

function loadDruginfoPresList(tableId){
	$(tableId).datagrid({
		...
		columns:[[
			{field:'testOne',title:'testOne',width:50,align:'center',editor:{type:'text'}},
			{field:'testTwo',title:'testTwo',width:120,align:'center',editor:{type:'text'}},
			{field: 'operate', title: 'operate', width: 100, align: 'center',
				formatter:function(value,row,index){
					var str="";
					if (row.editing) {
						str += "<a href=javascript:void(0); onclick=operates.saveRow(this)>保存</a>";
						str += "<a href=javascript:void(0); onclick=operates.cancelRow(this)>取消</a> ";
					} else {
						str += "<a href=javascript:void(0); onclick=operates.editRow(this)>修改</a> ";
						str += "<a href=javascript:void(0); onclick=operates.deleteRow(this)>删除</a> ";
					}
					return str;
				}
			}
		]],
		onLoadSuccess: function(data){
			 var $testTwo = $(tableId).datagrid('getColumnOption','testTwo');
				testTwo.editor = {
					type:'combogrid',options:{
						delay:500,                 //延迟5s
						required:true,             //是否为必填项
						multiple: true,            //可多选
						pannelWidth:120, 		   //下拉框宽度
						url:url,   			       //数据源地址
						showHeader:false,  		   //不显示下拉框标题
						prompt:'请输入', 		   //下拉框区域默认显示字段
						columns:[[
							{field:'name',title:'name',width:110,align:'center'}
						]],
						keyHandler:{
							query:function (q) {
							//当鼠标定位到数据框时，每5s拉取一次下拉框数据，test为数据框的值，作为传给数据源的参数
								$(this).combogrid("grid").datagrid("reload",{'test':q});
								$(this).combogrid("setValue",q);
							}
						},
						onShowPanel:function () {
							lastIndex=operates.getRowIndex(this); //正在编辑的行的索引
							$(this).combogrid("grid").datagrid("load");
						},
						onSelect:function(index,row){
							//获取field值为testTwo的列，行索引为lastIndex的编辑框对象
							var $testTwo=$(tableId).datagrid('getEditor',{index:lastIndex,field:"testTwo"});
							var $testOne=$(tableId).datagrid('getEditor',{index:lastIndex,field:"testOne"});
							//将获取到的数据的name字段赋值给$testTwo对象
							$($testTwo.target).combogrid("setValue",row.name);
							$($testOne.target).combogrid("setValue",row.id);
						}
					}
                }
            };
        },
		onBeforeEdit:function (index,row) {
            row.editing=true;
            $(tableId).datagrid('refreshRow',index);
        },
		onAfterEdit:function (index,row) {
            row.editing=false;
            $(tableId).datagrid('refreshRow',index);
        },
		onCancelEdit:function (index,row) {
            row.editing=false;
            $(tableId).datagrid('refreshRow',index);
        }
	});
}

方式二：加载本地数据

var testOneDatas = [
	{id:'1',name:'陕西西安'},
	{id:'2',name:'河北秦皇岛'}
	{id:'3',name:'哈尔滨'}
];
function loadDatagrideTable(tableId) {
	$(tableId).datagrid({
		...
		columns:[[
		    {field:'testOne',title:'testOne',width:100,align:'center', 
		    editor:{
				type:'combobox',
				options:{
					valueField:'id',
					textField:'name',
					data:testOneDatas,
					prompt:'请选择',
					panelHeight:'atuo'
					}
				}
			},
		]]
		...
	});
}