aui-datatable 中的动态 renderURL

Dynamic renderURL within aui-datatable

我正在使用 Liferay 6.2-ce-ga4,试图在 aui-datatable 列中嵌入自定义 renderURL。以下代码有效,除非我尝试从列格式化程序函数中调用以下代码行:

var renderURL = Liferay.PortletURL.createRenderURL();

调用此代码时,Eclipse 控制台中没有生成错误代码(因为我是从 Eclispe 中启动 Liferay)。我能告诉你的是,当我注释掉上面的行时,我得到了一个正确生成的 DataTable,但是在取消注释该行之后,DataTable 根本不呈现。

整页代码如下

<%@ page import="org.json.simple.JSONArray"%>
<%@ taglib uri="http://java.sun.com/portlet_2_0" prefix="portlet"%>
<%@ taglib uri="http://liferay.com/tld/portlet" prefix="liferay-portlet"%>
<%@ taglib uri="http://liferay.com/tld/ui" prefix="liferay-ui"%>
<%@ taglib uri="http://liferay.com/tld/util" prefix="liferay-util"%>
<%@ taglib uri="http://liferay.com/tld/aui" prefix="aui"%>

<script src="http://cdn.alloyui.com/2.0.0/aui/aui.js"></script>
<link href="http://cdn.alloyui.com/2.0.0/aui-css/css/bootstrap.min.css" rel="stylesheet"></link>

<portlet:defineObjects />

<%
    JSONArray involvedParties = (JSONArray) renderRequest.getAttribute("involvedPartyDetails");
%>

<aui:script>
    YUI().use('aui-datatable', 'datatable-sort', 'liferay-portlet-url', function(Y) {

        var columns = [ {
            label : 'Involved Party Name',
            key : 'name',
            formatter : function(o) {
                // var renderURL = Liferay.PortletURL.createRenderURL();
                return '<a href="http://www.cnn.com/">' + o.data.name + '</a>';
            },
            allowHTML : true,
            sortable : true
        } ];

        var data = <%=involvedParties%>
        var dataTable = new Y.DataTable({
            columns : columns,
            data : data,
            scrollable : "y",
            height : "500px"
        }).render('#myDataTable');
    });
</aui:script>

<div id="myDataTable"></div>

我的liferay-portlet.xml给出如下:

<?xml version="1.0"?>
<!DOCTYPE liferay-portlet-app PUBLIC "-//Liferay//DTD Portlet Application 6.2.0//EN" "http://www.liferay.com/dtd/liferay-portlet-app_6_2_0.dtd">

<liferay-portlet-app>
    <portlet>
        <portlet-name>involved-party-list</portlet-name>
        <icon>/icon.png</icon>
        <header-portlet-css>/css/main.css</header-portlet-css>
        <footer-portlet-javascript>
            /js/main.js
        </footer-portlet-javascript>
        <css-class-wrapper>
            involved-party-list-portlet
        </css-class-wrapper>
        <add-default-resource>true</add-default-resource>
    </portlet>
    <role-mapper>
        <role-name>administrator</role-name>
        <role-link>Administrator</role-link>
    </role-mapper>
    <role-mapper>
        <role-name>guest</role-name>
        <role-link>Guest</role-link>
    </role-mapper>
    <role-mapper>
        <role-name>power-user</role-name>
        <role-link>Power User</role-link>
    </role-mapper>
    <role-mapper>
        <role-name>user</role-name>
        <role-link>User</role-link>
    </role-mapper>
</liferay-portlet-app>

如有任何关于如何为数据中的每一行构建动态 renderURL 的建议 table,我们将不胜感激。

附带说明一下,我尝试用 AUI() 替换 YUI(),但这也会导致数据 table 不会在浏览器中生成。对于使用 AUI 与 YUI 的好处的评论也将不胜感激。

我使用 Chrome 的 "Developer Tools Console" 查看输出,并收到以下错误消息:

yui: NOT loaded: liferay-portlet-url

看来我必须使用 AUI() 而不是 YUI() 来利用 Liferay 扩展。

您自己给出了部分答案 - 然而,还有更多内容:<aui:script> 已经使 AUI 可用。你可以只替换你的行

<aui:script>
    YUI().use('aui-datatable', 'datatable-sort', 'liferay-portlet-url', function(Y) {

<aui:script use="aui-datatable,datatable-sort,liferay-portlet-url">

并在这打开的块中使用 AUI 作为 A。无需在此标签内添加额外的 YUI 或 AUI 块。