在Alloy UI数据表中显示链接

时间:2016-02-10 06:34:44

标签: json alloy-ui

我想在合金ui数据表中添加超链接。以下是我的代码。

<head>
    <link href="http://cdn.alloyui.com/3.0.1/aui-css/css/bootstrap.min.css" rel="stylesheet"></link>
    <script src="http://cdn.alloyui.com/3.0.1/aui/aui-min.js"></script>
    <script>
        YUI().use(
          'aui-datatable',
          function(Y) {
            var columns = ['name', 'address', 'city', 'state','edit'];

            var data = [
              {address: '1236 Some Street', city: 'San Francisco', name: 'John A. Smith', state: 'CA', edit:'<a href="www.google.com">Google</a>'},
              {address: '3271 Another Ave', city: 'New York', name: 'Joan B. Jones', state: 'NY', edit:'<a href="www.google.com">Google</a>'},
              {address: '9996 Random Road', city: 'Los Angeles', name: 'Bob C. Uncle', state: 'CA', edit:'<a href="www.google.com">Google</a>'},
              {address: '1623 Some Street', city: 'San Francisco', name: 'John D. Smith', state: 'CA', edit:'<a href="www.google.com">Google</a>'},
              {address: '9899 Random Road', city: 'Los Angeles', name: 'Bob F. Uncle', state: 'CA', edit:'<a href="www.google.com">Google</a>'}
            ];

            new Y.DataTable.Base(
              {
                columnset: columns,
                recordset: data
              }
            ).render('#myDataTable');
          }
        );
    </script>
</head>
<body>
    <div id="myDataTable"></div>
</body>

在显示期间,它将html显示为字符串。我怎么能把它显示为超链接?

我认为我们无法在JSON中添加标记标记,但是有没有机会完成我的工作。任何帮助将不胜感激...... !!

1 个答案:

答案 0 :(得分:4)

我认为您可以调整列定义以适应链接。

假设您想要在edit列下的值上建立链接,则必须将其定义为:

var columns = [
    'name', 
    'address', 
    'city', 
    'state',
    {
        key: 'edit',
        allowHTML: true // Must be set or the html will be escaped
    }
];

但是我没有测试过这个。您可以找到有关Datatable Formatters here

的更多信息