怎么在easyui的datagrid里面设计级联下拉列表

金一星 发布于 2012/03/28 20:15
阅读 9K+
收藏 1
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>test</title>

<script type="text/javascript">
    $(function(){
        var lastIndex;
	$('#tt').datagrid({
	    url: 'dategrid_data.json',
	    rownumbers: true,
	    collapsible:true,
	    striped: true,
	    columns:[[
                {field:'id',title:'id',hidden:true},
                {field:'type',title:'类型',width:150,align:'center',
                    editor:{type:'combobox',options:{required:true}}
                },
            	{field:'name',title:'名称',width:150, align:'center',
                    editor:{type:'combobox',options:{required:true}}
                },
            ]],
	    toolbar:[
	        {	
	            text:'增加',		
	            iconCls:'icon-add',
	            handler:function(){
		        $('#tt').datagrid('endEdit', lastIndex);
			$('#tt').datagrid('appendRow',{
		            id:'',
			    type:'',
			    name:''
			});
			var lastIndex = $('#tt').datagrid('getRows').length-1;
		    }
		},'-',{
		    text:'删除',
		    iconCls:'icon-remove',
		    handler:function(){
			var row = $('#tt').datagrid('getSelected');
			if (row){
			    var index = $('#tt').datagrid('getRowIndex', row);
			    $('#tt').datagrid('deleteRow', index);
			}
		    }
		}
	    ],
	    onBeforeLoad:function(){
		$(this).datagrid('rejectChanges');
	    }
	});
    
</script>
</head>
<body >
    <table align="center" id="tt" style="height:auto" width="100%" title="test" singleSelect="true" >
    </table>				
</body>
</html>

    页面的大致代码如上,使用的版本是jquery-easyui-1.2.3,我想把datagrid中的type和name这两列做成级联下拉列表,但是我不知道怎么在点击下拉列表后获取到这个下拉列表所在行的rowIndex,还请各位指点!

 

 

 

加载中
0
金一星

各位帮帮忙啊

这个问题我实在搞不定啊

金一星
@ayuwxf : 多谢你的回复,但是如何在点击下拉列表的时候得到对应行的rowindex呢,我试着往上寻找class为datagrid-row-editing的对象,然后获取datagrid-row-index值,可是easyui把下拉框的div给设计到table外面去了...
a
ayuwxf
在单击/双击的时候就将rowindex保存到一个全局变量就可以啊
0
xxiu
xxiu
function getRowIndex(target) {
    var tr = $(target).closest('tr.datagrid-row');
    return parseInt(tr.attr('datagrid-row-index'));

然后用getRowIndex(this)

返回顶部
顶部