jQuery的datatable怎么才能给某一列添加超链接?

aocolumeDef.这个里面去定义.return返回的字符串会代替原来cell里面的内容

e.g:
datatable=$(‘#dt_basic‘).dataTable({
             "bAutoWidth": false,
             "bStateSave":true,
                "sPaginationType": "bootstrap_full",
                "sAjaxSource":url,
                "sAjaxDataProp": "poolList",
                "aoColumns": [{ "sTitle":"ID", "mDataProp": "poolId","sClass":"center"},
                              { "sTitle":"存储池名称", "mDataProp": "poolName","sClass":"center"},
                              { "sTitle":"运行状态", "mDataProp": "status","sClass":"center"},
                              { "sTitle":"缓存状态", "mDataProp": "iscache","sClass":"center"},
                              { "sTitle":"总容量", "mDataProp": "diskPack.poolSize","sClass":"center"},
                              { "sTitle":"使用率", "mDataProp": "diskPack.usage" ,"sClass":"td-progress center"},
                              { "sTitle":"操作","mDataProp": "objectId","sClass":"center"},
                              { "sTitle":"创建时间", "mDataProp": "createTime","sClass":"center"}
                              ],
                "aoColumnDefs":[{"aTargets":[6],"mRender":function(data,type,full){
                     return "<a href=\"#myModal-edit\" data-toggle=\"modal\" onclick=\"preUpdate(‘"+data+"‘)\"> <i class=\"fa fa-lg-2 fa-pencil\"> </i> </a>     <a href=\"javascript:void(0)\" data-toggle=\"modal\" class=\"smart-mod-eg1\" onclick=\"delPool(‘"+data+"‘,event)\"> <i class=\"fa fa-lg-2 fa-trash-o\"> </i> </a>    "}
                    },
                    {"aTargets":[5],"mRender":function(data,type,full){
                     return data+"%<div class=\"progress\"><div aria-valuetransitiongoal=\""+data+"\" class=\"progress-bar bg-color-teal\" style=\"width: "+data+"%;\" aria-valuenow=\""+data+"\"> </div></div>";
         }

},
                    {"aTargets":[2],"mRender":function(data,type,full){
                     if(data==‘2‘){
                      return "维护";
                     }else{
                      return "运行";
                     }
                       }
                       }, 

                       {"aTargets":[3],"mRender":function(data,type,full){
                        if(data==‘1‘){
                         return "是";
                        }else{
                         return "否";
                        }

                          }
                          },
                          {"aTargets":[0],"mRender":function(data,type,full){
                           return data+"  <a href=\"#myModal-file\" data-toggle=\"modal\" onclick=\"viewpool(‘"+full.objectId+"‘,event)\"> <i class=\"fa fa-lg-2 fa-file-o \"></a>";
                          }
                          }
                      ]
            });
时间: 2024-12-16 03:48:58

jQuery的datatable怎么才能给某一列添加超链接?的相关文章

DataTable操作(建表,建行,建列,添加数据)

public DataTable GetNewTable() { DataTable dt2 = new DataTable("NewDataSet"); //创建一个新Table,必须设置表名 dt2.Columns.Add(new DataColumn("Result",typeof(System.String))); //添加字段,并设置类型 DataRow row = dt2.NewRow(); //创建一个新的行 row["Result"

Jquery的DataTable插件 AJAX 服务器分页的的学习心得(java版)

首先得先引入对应的js 1.jquery.min.js  首先导入 2. File:        jquery.dataTables.min.js Version:     1.9.4     这是我使用的版本 这是  jsp 页面 关键的table  代码 <table id="fuck" class="table table-bordered data-table"> <thead> <tr> <span style=

jQuery插件 dataTable Ajax分页功能实现

jQuery 的插件 dataTables 是一个优秀的表格插件,提供了针对表格的排序.浏览器分页.服务器分页.筛选.格式化等功能.需要可以到 dataTables 的网站 http://www.datatables.net/ 下载这个脚本库. 在网页开发过程中,我们可能会从后台读入数据建表.当数据过大时,可能导致建表时间过长,于是就需要实现Ajax分页功能,代码如下: HTML: <table id="example" class="display" wid

jquery的DataTable按列排序

不管你用SQL查询数据时,是如何排序的,当数据传递给DataTable时,它会按照它自己的规则再进行一次排序,这个规则就是"order" 可以使用以下代码来进行排序 $('#example').dataTable( { "order": [] } ); 通过"order"属性来进行排序,默认是按第一列的升序排序的,如下: $('#example').dataTable( { "order": [[ 0, 'asc' ] //这

DataTable学习笔记---排序细则、列隐藏

耽误了好几天,因为要做一个嵌入式的实验-android内核编译与裁剪,很久之前装的wubi不知道为什么运行出错了,然后看着当前的win7系统觉得有点讨厌了,也是因为快1年半没装机了,所以就重新装机了,结果就各种杯具,统计装了2次win7,2次win8,2次wubi,期间碰到了不知多少问题,另一方面限于这可恶的网速,着实让我蛋疼了一把,然后又是各种压力,本人大三了,到了要找实习单位的时候,还有是否决定考研,也挺烦心的.今天趁着有点时间了,继续我们的dataTable学习吧.    1.DataTa

jQuery源码06-jQuery = function(){};给JQ对象,添加一些方法和属性,extend : JQ的继承方法,jQuery.extend()

/*! * Includes Sizzle.js 选择器,独立的库 * http://sizzlejs.com/ */ (function( window, undefined ) { //"use strict"; var // rootjQuery = jQuery(document) = $();压缩有用 rootjQuery, // dom是否加载完 readyList, // core_strundefined == 'undefined' core_strundefined

Jquery easy ui datagrid動態加載列問題

1.如下图效果是当选择不同的日期范围时datagrid则会加载出对应的列数 2.首先是后台组装数据,我采用的是循环并拼接DataTable数据,如下代码 //循環添加datagrid所需的表頭數據 for (int i = 0; i < table.Columns.Count; i++) { columns.AppendFormat("{{field:'{0}',title:'{1}',align:'center',width:{2}}},", table.Columns[i].

从多列的DataTable里取需要的几列(转)

方法一: 也是广为人知的一种: YourDataTable.Columns.Remove("列名"); 但是这种情况只适合于去掉很少列的情况. 如果有很多列我却只要一两列呢,那就得用方法二了. 方法二: DataTable dat = YourDataTable.DefaultView.ToTable(false, new string[] { "你要的列名", "你要的列名" }); 补加dataTable操作相关内容: 对DataTable 

jQuery 如何先创建、再修改、后添加DOM元素

例如顺序执行[创建]-> [修改]-> [添加]三个动作. 由于jQuery支持链式操作,其实就是设计模式的builder模式,所以我们可以把三个操作串在一起来执行. 首先创建一个p元素,内容包含一个a元素. 复制代码代码如下: $('<p><a>jQuery</a></p>') 然后为a元素添加一个href属性 复制代码代码如下: $('<p><a>jQuery</a></p>').find('a