首先,我我们要有一个json格式的datagrid_data.json文件,如下:

其次,在body下有个数据表格,引入json

<table class="easyui-datagrid" style="width:400px;height:250px" data-options="url:'datagrid_data.json',fitColumns:true,singleSelect:true">
    <thead>   
        <tr>    
        <th data-options="field:'code',width:100">Code</th>         
        <th data-options="field:'name',width:100,formatter:planUrl">Name</th>        
        <th data-options="field:'price',width:100,align:'center'">Price</th>
        <th data-options="field:'test',width:100">Test</th>     
        </tr>       
    </thead>
</table>

然后,在脚本script中,写超链接的方法(跳转的路径,想做的事情)

<link rel="stylesheet" type="text/css" href="../../js/jquery-easyui-1.4.3/themes/metro/easyui.css">
<link rel="stylesheet" type="text/css" href="../../js/jquery-easyui-1.4.3/themes/icon.css">
<script type="text/javascript" src="../../js/jquery-easyui-1.4.3/locale/easyui-lang-zh_CN.js"></script>
<script type="text/javascript" src="../../js/jquery-easyui-1.4.3/jquery.min.js"></script>
<script type="text/javascript" src="../../js/jquery-easyui-1.4.3/jquery.easyui.min.js"></script>

<script>

//value:绑定列的所有值,row:整个datagrid的所有行,index:绑定列的下标
    function planUrl(value,row,index){    
           if(value){
           return "<a href=http://www.baidu.com?code="+row.code +">"+value+"</a>";
         }
      }
</script>

最后,显示的效果是这样的

datagrid动态数据添加超链接的方法的更多相关文章

  1. LoadRunner脚本关联动态数据的最简单方法

    为什么要关联动态数据呢?举个例子,在对我们平台的工作流性能测试时, 在待办任务里面选择一条记录执行发送操作,LoadRunner VuGen会详细记录下来流程发送操作的细节,但在回放脚本的时候会有问题 ...

  2. easyUI的datagrid每行数据添加操作按钮的方法

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

  3. js jQuery取消添加超链接的方法小结

    今天在工作中需要将某个链接给取消实现只触发事件的目的,后来发现批量取消链接等,脚本之家简单的给整理了下,希望对需要的朋友有所帮助. 单个链接取消链接并触发js事件 <a href="j ...

  4. EasyUI的datagrid列属性添加超链接

    $("#dg").datagrid({        url: "../Ajax/PurchaseAjax.ashx",        queryParams: ...

  5. php调用html添加超链接的方法

    不知道为何老搜不到,使用require_once命令导入的HTML文件没法加载js脚本,于是只能另谋他路,终于实线了,代码为 <?php header("Content-type:te ...

  6. 我的Python学习笔记(四):动态添加属性和方法

    一.动态语言与静态语言 1.1 动态语言 在运行时代码可以根据某些条件改变自身结构 可以在运行时引进新的函数.对象.甚至代码,可以删除已有的函数等其他结构上的变化 常见的动态语言:Object-C.C ...

  7. 【17】有关python面向对象编程的提高【多继承、多态、类属性、动态添加与限制添加属性与方法、@property】

    一.多继承 案例1:小孩继承自爸爸,妈妈.在程序入口模块再创建实例调用执行 #father模块 class Father(object): def __init__(self,money): self ...

  8. 6月16 ThinkPHP连接数据库及Model数据模型层--------查询及数据添加

    连接数据库配置及Model数据模型层 convertion.php config.php 1.在config.php做数据库连接配置 2.修改配置 /* 数据库设置 */ 'DB_TYPE' => ...

  9. Flex4 中<s:Datagrid>、<mx:Datagrid>添加超链接的完整方法

    <s:Datagrid>的添加超链接方法(链接文字会重叠) <s:GridColumn dataField="_fileName" headerText=&quo ...

随机推荐

  1. cocos2d-x-3.0 的改变,由于变得太多,一点点累积吧!

    1.cpp  改成  Point 2.setIsRelativeAnchorPoint() 改成  ignoreAnchorPointForPosition() 3.Layer::create   图 ...

  2. android中自定义view---实现竖直方向的文字功能,文字方向朝上,同时提供接口,判断当前touch的是哪个字符,并改变颜色

    android自定义view,实现竖直方向的文字功能,文字方向朝上,同时提供接口,判断当前touch的是哪个字符,并改变颜色. 由于时间比较仓促,因此没有对代码进行过多的优化,功能远远不如androi ...

  3. MS SQL的存储过程

    -- ============================================= -- Author: -- Create date: 2016-07-01 -- Descriptio ...

  4. 命令行 更新Android sdk

    使用如下代理服务器: 大连东软信息学院镜像服务器地址: http://mirrors.neusoft.edu.cn 端口:80 北京化工大学镜像服务器地址: IPv4: http://ubuntu.b ...

  5. 探究MaxxBass音效

    MaxxBass是什么?官方的介绍是这样的: — Patented Waves MaxxBass psycho-acoustic bassextension delivers a more natur ...

  6. C++ Low level performance optimize

    C++ Low level performance optimize 1.  May I have 1 bit ? 下面两段代码,哪一个占用空间更少,那个速度更快?思考10秒再继续往下看:) //v1 ...

  7. 对象与Byte数组相互转化工具方法

    /** * 对象转byte * @param obj * @return */ private byte[] ObjectToByte(Object obj) { byte[] bytes = nul ...

  8. 从function前面的!想到的

    最近没事喜欢看看,一些js库的源码,结果发现库前不是加一个!就是加+或者一个(),心中猜出个大概知道这个是让函数自动执行,可是这么多符号达到同一个目的,原理是什么呢,下面做一下剖析: 先从IIFE开始 ...

  9. 二十九、EFW框架开发的系统支持SaaS模式和实现思路

    回<[开源]EFW框架系列文章索引>        EFW框架源代码下载V1.3:http://pan.baidu.com/s/1c0dADO0 EFW框架实例源代码下载:http://p ...

  10. Malek Dance Club(递推)

    Malek Dance Club time limit per test 1 second memory limit per test 256 megabytes input standard inp ...