Question

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html>
<html>
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Populating JSP</title>

<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="http://cdn.datatables.net/1.10.0/js/jquery.dataTables.min.js"></script>
<link rel="stylesheet" href="http://cdn.datatables.net/1.10.0/css/jquery.dataTables.css" />
<link rel="stylesheet" href="http://cdn.datatables.net/1.10.2/css/jquery.dataTables.css" />

</head>
<body>
    <table id="example" class="display" cellspacing="0" width="100%">
        <thead>
            <tr>
                <th>id</th>
                <th>salary</th>
            </tr>
        </thead>
        <tbody>

        </tbody>
    </table>

     <script>

        $(document).ready(function() {
                $('#example').dataTable( {
                    serverSide: true,
                    "fnRowCallback": function( nRow, aData, iDisplayIndex ) {
                        $('td:eq(2)', nRow).html('<a href="http://www.google.com' + aData[2] + '">' +
                            aData[2] + '</a>');
                        return nRow;
                    },
                    ajax : {
                        url: 'hello/data1',
                        dataType:'json',
                        type: 'POST'

                    }

                }

                 );
        });

    </script>

</body>
</html>

我有2个coulmns，ID和Salary。我将工资链接到google.com，因为我正在使用fnRowCallback函数。但这似乎不起作用。你觉得我哪里错了jsp如上所示。

Answer 1

使用自定义列定义columnDefs来更改列呈现。

$('#example').dataTable( {
                serverSide: true,
                "aoColumnDefs" : [
                 {
                      "mData": "name",                         
                      "sClass": "dataTable-user-list-name",
                     "fnRender": function (oObj) {
                          return '<a href="/#/' + oObj.aData['detailsUrl'] + '">oObj.aData['name']<a>'
                 }],                   
                ajax : {
                    url: 'hello/data1',
                    dataType:'json',
                    type: 'POST'

                }

            }

无法链接数据表中的列

1 个答案: