2017-03-08 47 views
0

我想補充jQuery UI's datepicker我的Liferay 7門戶,但我不斷收到此錯誤:如何將jQuery UI的datepicker添加到Liferay 7 portlet?

Object doesn't support property or method 'datepicker'

我設置了這樣的依賴性:

@Component(
immediate = true, 
property = { 
    "com.liferay.portlet.display-category=category.tests", 
    "com.liferay.portlet.header-portlet-javascript=https://code.jquery.com/ui/1.12.1/jquery-ui.js", 
    "com.liferay.portlet.instanceable=true", 
    "javax.portlet.display-name=Advanced Date Picker", 
    "javax.portlet.init-param.template-path=/", 
    "javax.portlet.init-param.view-template=/view.jsp", 
    "javax.portlet.resource-bundle=content.Language", 
    "javax.portlet.security-role-ref=power-user,user" 
}, 
service = Portlet.class 
) 

所以我只能在我的portlet上查看是沒有任何腳本功能的輸入字段。 我讀到,從版本7開始,Liferay已經預先實現了一個基本的jQuery庫,所以我不需要在本地下載並引用它。

有沒有什麼辦法可以使用這個datepicker,或者我應該使用AlloyUI的嗎?

回答

2

如果您想將liferay 7主題/ portlet /應用程序與jQuery UI集成,您需要對jQuery UI庫本身進行微妙的更改。

默認庫開始 -

(function(factory) { if (typeof define === "function" && define.amd) { // AMD. Register as an anonymous module. define([ "jquery" ], factory); } else { // Browser globals factory(jQuery); } }(function($) {

如果直接在你的Liferay的應用程序中添加庫,你會得到一個錯誤 - 不匹配匿名定義()模塊:

爲了克服這個問題,您需要更改庫就像

(function(factory) { factory(jQuery); }(function($) {

你正在做的是刪除引起問題的定義調用的引用,因爲默認情況下已經加載了jQuery。 您需要爲其他包含調用的JS庫執行相同的事情。

+0

我到底需要改變這一點?我需要「修補」jQuery.js文件嗎? –

+0

@a_horse_with_no_name不,任何jQuery依賴庫.. 即slick.js,jquery ui等等。簡而言之,任何依賴於jQuery的js –