easyui 在datagrid中增加行级别的按钮

本是古典何须时尚 2022-04-13 03:43 603阅读 0赞

先看下效果：

![20181127023851765.png][]

第一步，首先将相关按钮定义出来

<div id="index_listMissionBenchmarking_datagrids_action" style="display: none;">
    	<a href="#" class="easyui-linkbutton actions editResources" data-options="iconCls:'icon-search'">维护任务资源库</a>
    </div>

第二步，使用列的formatter函数，将该对象使用上

var listMissionBenchmarkingActions = $("#index_listMissionBenchmarking_datagrids_action");
    
    {
    			title:'任务对标信息',
    			field:'actions',
    			width:50,
    			formatter: function(value,row,index){
    				return listMissionBenchmarkingActions.children("a.actions").attr('data-id', row.id).end().html();
    			}
    
    		}

第三步，给按钮绑定事件

var missionDatagrids = $("#index_listMissionBenchmarking_datagrids");//任务清单主体
    var gridPanel = missionDatagrids.datagrid("getPanel");
    
    	  //给操作按钮绑定事件
    	  gridPanel.on("click", "a.editResources", function () {
    	    var id = this.dataset.id;
    	    console.info(id);
    	  })

以上！

[20181127023851765.png]: /images/20220413/9c1e771d621d4abfbf435f09ec0c9136.png

发表评论取消回复

表情：

评论列表（有 0 条评论，603人围观）

还没有评论，来说两句吧...

相关阅读

相关 EASYUI DataGrid 获取正在编辑的行index

EASYUI 官方没提供直接获取正在编辑行的index，但是我们可以通过正在编辑行来获取他的行号正处于编辑的有一个class属性为 datagrid-row-editing

分手后的思念是犯贱/ 2023年10月05日 12:09/ 0 赞/ 9 阅读

相关 easyui 分类统计_jQuery easyUI datagrid 增加求和统计行的实现代码

下面小编就为大家带来一篇jQuery easyUI datagrid 增加求和统计行的实现代码。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。在datagrid的o

雨点打透心脏的1/2处/ 2023年01月10日 03:56/ 0 赞/ 243 阅读

相关 EasyUi DataGrid的列中添加带图标按钮

需求：如题： 1、js代码：在js构造easyui列表的代码中增加一个虚拟列（其中的addFieldViewTab 是我自定义的一个点击函数） ,

妖狐艹你老母/ 2022年11月30日 12:41/ 0 赞/ 594 阅读

相关【EasyUI-扩大在DataGrid显示次网格的行】

一.下载并引用：datagrid-detailview.js脚本文件二.添加UrlInfo控制器,添加Index页面代码如下： @{ Layout

落日映苍穹つ/ 2022年08月23日 05:43/ 0 赞/ 159 阅读

相关【easyui】datagrid中增加按钮样式

1 首先，在datagrid的数据列format一个动态的btn var btn = '<a class="throwcls" onclick="goToRespon

以你之姓@/ 2022年07月13日 00:43/ 0 赞/ 299 阅读

相关【easyui】datagrid中增加进度条

1 增加formater函数 { field: 'pct', title: '完成比例', width: 100, align: 'center', sortable

男娘i/ 2022年07月13日 00:43/ 0 赞/ 225 阅读

相关 jquery-EasyUI datagrid 换行

加上参数：nowrap: false,即可。如下代码： $("\userList").datagrid(\{ width: 'auto', hei

怼烎@/ 2022年07月12日 01:29/ 0 赞/ 344 阅读

相关 easyui 在datagrid中增加行级别的按钮

先看下效果： ![20181127023851765.png][] 第一步，首先将相关按钮定义出来 <div id="index_listMissionBench

本是古典何须时尚/ 2022年04月13日 03:43/ 0 赞/ 604 阅读

相关 easyui datagrid 增加searchbox

<div id="testa" style="position: relative;top:10%;"> <!-- 这里的padding-top是让搜索栏向下

ゝ一纸荒年。/ 2021年12月13日 01:27/ 0 赞/ 315 阅读

相关 easyui datagrid 每行数据添加按钮

今天做项目的时候，想在easyui的datagrid每一列数据后边都加上一个操作按钮，一开始想在后台拼接字符串用JSON传回，但是我测试之后发现这个方法不管用，在网上搜索了一下

ゝ一纸荒年。/ 2021年07月28日 11:59/ 0 赞/ 483 阅读