将 JavaScript 资源插入 Liferay Portlet答案

【问题标题】：Inserting a JavaScript resource into a Liferay Portlet将 JavaScript 资源插入 Liferay Portlet
【发布时间】：2013-12-26 08:41:57
【问题描述】：

我想在我的 Liferay portlet 中使用jsTree，但每次执行脚本时都会出错：

TypeError: treeContainer.jstree is not a function @ localhost:8080/web/guest/home:14

我知道它没有可用的JS文件，所以我尝试了这两种方法，但它们都不起作用。

首先：通过添加直接包含它

<script type="text/javascript" src="jquery.jstree.js"></script>

进入JSP。虽然我可以在我的 IDE 中看到它被“链接”，但在构建和部署后它不可用（duh）。

第二：像这样在liferay-portlet.xml中编辑它：

<portlet>
    <portlet-name>myPortlet</portlet-name>
    <instanceable>false</instanceable>
    <!-- other mappings here -->
    <header-portlet-javascript>my/resource/folder/myPortlet/jquery.jstree.js
    </header-portlet-javascript>
</portlet>

但即使我这样编辑它，我也会在浏览器控制台中得到 404。

JSP中使用的函数：

<script type="text/javascript">
$(".tree-search").click(function(){

    treeContainer = $(this).siblings('.tree-container');

    // correct data is taken from ${jsonFake}
    treeContainer.jstree({
        "plugins":["themes","html_data","ui"], "json_data": { data: ${jsonFake}}
    });

    treeContainer.show();
    treeContainer.animate({
        opacity: "1"
    }, 750);

});
</script>

请问我做错了什么？

【问题讨论】：

你能确保你的 js 路径在 docroot 文件夹之后开始吗？例如，如果 js 位于路径 docroot/js/abc.js 并且您的 js-path 应该是 /js/abc.js
在独立/部署中，我为我的模块选择 WAR 文件夹，然后路径是“WEB-INF/js/jquery.jstree.js”，所以我把它放到了我的 liferay-portlet .xml 但它不起作用..我会尝试更多地使用它..

标签： java include liferay portlet jstree

【解决方案1】：

这似乎是路径问题：

在 docroot 中创建一个名为 js 的文件夹并将此文件放在那里。添加脚本src，如：

<script type='text/javascript' src='/js/jquery.jstree.js'></script>

【讨论】：

【解决方案2】：

在你当前的主题.like中添加portal_normal.vm文件中的js文件

<script type="text/javascript" src="jquery.jstree.js"></script>

【讨论】：