• easyui如何在datagrid 每行增加超链接


    在广仲的一个项目中,有这样一个需求,就是利用easyui框架为每一个行上的某一个格添加一个超链接,如下图:

    在案号那一列,每一行都是的这个案号都是一个超链接,平时我们都是通过field,绑定从后台获取的数据,如果没有什么特殊要求的话,就可以用了,但是要对数据的格式,还有属性(比如添加一些超链接),这就要用到easyui里面自带的一个formatter属性,它的值是一个函数,函数里有三个参数,分别是value,row,index。下面来介绍一下这几个参数:

    1、value:是当前field绑定数据的值,比如,我当前这个field绑定的是一个名为id的属性,那么这个value的就是当前行上的这个id的值

    2、rowData:当前这一行上的所有数据,包括显示的和未显示的

    3、index:当前是第几行的行值

    那这个函数怎么样用呢?下面就我本次 的项目做个简单的介绍:

    function getMoreRecent(){
    			$('#filedGrid').datagrid({ 
    			title:"立案秘书收到的案子",
    			url:"/arbcase/api/pageClickLog/recentCaseTopList", 
    			columns:[[ 
    			{field:'collectNo',title:'案号',100,
    			formatter: function(value,row,index){
          	return '<a style="color:blue" href="/arbcase/case-'+row.id+'">'+row.collectNo+'</a>';
         } }, 
    			{field:'nature',title:'案由',100}, 
    			{field:'accuserListText',title:'申请人',100},
    			{field:'appelleListText',title:'被申请人',100},
    			{field:'createdDatetimeText',title:'录入时间',50}
    			]] 
    			});	
    	}
    

    上面代码的特点就是就是,url是可以通过变量传入的,第二列的行数也是可以自动设置的,同时可以对每一列的数据格式进行转换,像我这个就是返回一个超链接,大概就是这样了

  • 相关阅读:
    撩课-Web大前端每天5道面试题-Day6
    撩课-Python-每天5道面试题-第7天
    撩课-Java每天5道面试题第17天
    撩课-Web架构师养成系列(第二篇)-async
    撩课-Web大前端每天5道面试题-Day5
    撩课-Python-每天5道面试题-第6天
    撩课-Java每天5道面试题第16天
    撩课-Web大前端每天5道面试题-Day4
    撩课-Python-每天5道面试题-第5天
    Three.JS鼠标移动元素(转)
  • 原文地址:https://www.cnblogs.com/baby-lijun/p/5152159.html
Copyright © 2020-2023  润新知