easyUI-datagrid根据id进行回显选中对应行

最新推荐文章于 2021-06-01 16:20:35 发布

Amor_fatii

最新推荐文章于 2021-06-01 16:20:35 发布

阅读量2.2k

点赞数 1

CC 4.0 BY-SA版权

分类专栏： Java 文章标签： easyUI

本文链接：https://blog.youkuaiyun.com/Amor_fatii/article/details/86545700

Java 专栏收录该内容

19 篇文章

订阅专栏

本文介绍了如何使用easyUI的datagrid组件，根据指定ID回显并高亮显示对应的行。主要涉及JavaScript代码实现，使得用户能够快速定位到已选择的数据行。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

页面代码：

js代码：


	$('#pro').click(function(){
		$('#goodsDialog').dialog('open');
		
		
				//获取需要选中的记录ID
				var refId =$("#refId").val();
			    
			    
			    //获取数据列表中的所有数据
			    var rows = $("#gd_dataGrid").datagrid("getRows");
			    //循环数据找出列表中ID和需要选中数据的ID相等的数据并选中
			    for(var i=0;i<rows.length;i++){
			      var rowId = rows[i].id;
			      
			        if(rowId==refId){
			          var index = $("#gd_dataGrid").datagrid("getRowIndex",rows[i])
			          $("#gd_dataGrid").datagrid("selectRow",index);
			        }
			    }
			
		
	});
	
	$('#shop').click(function(){
		$('#shopsDialog').dialog('open');
		//获取需要选中的记录ID
				var refId =$("#refId").val();
			    
			    //获取数据列表中的所有数据
			    var rows = $("#shop_dataGrid").datagrid("getRows");
			    //循环数据找出列表中ID和需要选中数据的ID相等的数据并选中
			    for(var i=0;i<rows.length;i++){
			      var rowId = rows[i].id;
			      
			        if(rowId==refId){
			          var index = $("#shop_dataGrid").datagrid("getRowIndex",rows[i])
			          $("#shop_dataGrid").datagrid("selectRow",index);
			        }
			    }
		
	});
	
	$("#dataType").change(function(){
        var dataType = $(this).val();
        $("#dataPrdDiv").hide();
        $("#dataShopDiv").hide();
        if (dataType == 1) {
        	$("#dataPrdDiv").show();
        } else if (dataType == 2) {
        	$("#dataShopDiv").show();
        }
        
    });