Forums

Home » Alloy UI » English

Combination View Flat View Tree View
Threads [ Previous | Next ]
Kiran Kumar Boyini
How to use jquerry in liferay.
December 7, 2012 1:14 AM
Answer

Kiran Kumar Boyini

Rank: Expert

Posts: 287

Join Date: June 2, 2011

Recent Posts

Hi All,

I want to use jquerrry in liferay 6.0.6.
Suppose I want to use it in jsp.How I have to use it or liferay internally have this js library or i have to import this in externally .


Please provide the reply.

Thanks,

Kiran
Jitendra Rajput
RE: How to use jquerry in liferay.
December 7, 2012 1:26 AM
Answer

Jitendra Rajput

Rank: Liferay Master

Posts: 875

Join Date: January 7, 2011

Recent Posts

From Liferay 6 onwards jquery no longer included by default . You need to explicitly include it in your portlet or theme (if you want to use in all portlets).

Below blog will help you on the same.
http://www.liferay.com/web/nathan.cavanaugh/blog/-/blogs/using-jquery-or-any-javascript-library-in-liferay-6-0
Kiran Kumar Boyini
RE: How to use jquerry in liferay.
December 7, 2012 5:01 AM
Answer

Kiran Kumar Boyini

Rank: Expert

Posts: 287

Join Date: June 2, 2011

Recent Posts

Thank you Jitendra,

I follow the link and I am try to develop the jquerry portlet by following the links w r to your link.

http://www.liferay.com/web/nathan.cavanaugh/blog/-/blogs/using-jquery-or-any-javascript-library-in-liferay-6-0

But here I am not understanding the following things.

Build a project called “sample-jquery-portlet” with folder “docroot” and build.xml
Add CSS under the folder /docroot/css
Add images under the folder /docroot/css
Add jquery under the folder /docroot/js
Add liferay-display.xml, liferay-plugin-package.properties, liferay-portlet.xml, portlet.xml under the folder /docroot/WEB-INF
Especially, add following lines, for example, in the file liferay-portlet.xml.
<portlet>
<portlet-name>1</portlet-name>
<icon>/images/world.png</icon>
<header-portlet-css>/css/style.css</header-portlet-css>
<header-portlet-javascript>/js/jquery.js</header-portlet-javascript>
<footer-portlet-javascript>/js/jquery-ui-custom.js</footer-portlet-javascript>
<css-class-wrapper>sample-jquery-portlet</css-class-wrapper>
</portlet>


and also I am not understand the following statement.
Note that the property header-portal-javascript sets the path of JavaScript that will be referenced in the page's header relative to the portal's context path; and the property footer-portal-javascript sets the path of JavaScript that will be referenced in the page's footer relative to the portal's context path.
But in the above where I can find the jquery-ui-custom.js filw and I have a bit confusion to create the directory structure. as he mentioned in the document.
I have created docroot folder,inside i have created css,js foloders. And I am putting the .css,.png.,.jpg files in css folder.

Am I correct ?

Thanks,

Kiran
Oliver Bayer
RE: How to use jquerry in liferay.
December 7, 2012 1:30 AM
Answer

Oliver Bayer

Rank: Liferay Master

Posts: 889

Join Date: February 18, 2009

Recent Posts

Hi Kiran,

it depends emoticon.

If you want to use it in a single jsp use the html script-tag to include it.

If you want to use it in multiple places/ different portlets you have two possibilities:
- you can put the jquery js file in a custom theme (theme dependant but you can insert business logic how and when you include it) or
- use the "javascript.barebone.files" property in the portal-ext.properties file so jquery is always available e.g. also in the control panel portlets (theme independant)

Greets Oli

Participate in the State of Liferay Community 2017. Help the community and even win some prizes!