Include JavaScript Library in Liferay 7

Forums de discussion

Pikachu kute, modifié il y a 7 années.

Include JavaScript Library in Liferay 7

New Member Publications: 13 Date d'inscription: 09/03/17 Publications récentes

Hi all,
I am newbie in liferay, in my portlet, i want to use papaparse library, but after i included and run, it has an error: "Papa is not defined".
Please help me fix it, thanks.
Include in jsp:

&lt;%@ include file="../init.jsp" %&gt;

<script type="text/javascript" src="<%=request.getContextPath()%>/js/papaparse.js"></script>
<script type="text/javascript" src="<%=request.getContextPath()%>/js/test.js"></script>


<div>

    <input type="file" id="fileUpload">

</div>

My js file:

jQuery(document).ready(function () {
    $('input[type=file]').change(function() {
        var file = event.target.files[0];

        var data = new Papa.parse(file);
    });
})

Chema Balsas, modifié il y a 7 années.

RE: Include JavaScript Library in Liferay 7

Regular Member Publications: 127 Date d'inscription: 25/02/13 Publications récentes

The Using External Libraries tutorial in the Developer Network probably has the answer you're looking for.

If you're on DXP after FixPack-8 you can simply turn off the amd loader so plugins will load as you expect them again. In case you're in GA3, some workarounds are also provided.

Hope it helps!

Vicente Soriano Martinez, modifié il y a 7 années.

RE: Include JavaScript Library in Liferay 7

New Member Publications: 20 Date d'inscription: 23/07/14 Publications récentes

Shouldn't it be easier to include the js reference in the header-portlet-javascript element of the liferay-portlet.xml descriptor? Or if he's using the OSGi Liferay Portlet Service mapping, the com.liferay.portlet.header-portlet-javascript property, for instance.

@Pikachu kute you don't need to include <head> and <body> tags in your jsps.

Chema Balsas, modifié il y a 7 années.

RE: Include JavaScript Library in Liferay 7

Regular Member Publications: 127 Date d'inscription: 25/02/13 Publications récentes

Hey Vicente!

Sure, he can include the JS in better ways... he'll just have the same issue with the jQuery plugin nevertheless.

Pikachu kute, modifié il y a 7 années.

RE: Include JavaScript Library in Liferay 7

New Member Publications: 13 Date d'inscription: 09/03/17 Publications récentes

Vicente Soriano Martinez:

Shouldn't it be easier to include the js reference in the header-portlet-javascript element of the liferay-portlet.xml descriptor? Or if he's using the OSGi Liferay Portlet Service mapping, the com.liferay.portlet.header-portlet-javascript property, for instance.

@Pikachu kute you don't need to include <head> and <body> tags in your jsps.

Thanks you, I tried but it's not working, still got that error.

Chema Balsas, modifié il y a 7 années.

RE: Include JavaScript Library in Liferay 7

Regular Member Publications: 127 Date d'inscription: 25/02/13 Publications récentes

There's a similar case here: https://web.liferay.com/es/community/forums/-/message_boards/message/84419309

Hope that helps!

Pikachu kute, modifié il y a 7 années.

RE: Include JavaScript Library in Liferay 7

New Member Publications: 13 Date d'inscription: 09/03/17 Publications récentes

Chema Balsas:

There's a similar case here: https://web.liferay.com/es/community/forums/-/message_boards/message/84419309

Hope that helps!

Thanks you! I included successfully library, but could you explain for me why we need 2 <script> tag:

<script>
    define._amd = define.amd;
    define.amd = false;
</script>

and

<script>
    define.amd = define._amd;
</script>

Chema Balsas, modifié il y a 7 années.

RE: Include JavaScript Library in Liferay 7

Regular Member Publications: 127 Date d'inscription: 25/02/13 Publications récentes

Hey Pikachu!

The main problem you were having including the library is that Liferay 7 ships with an AMD Loader. This makes some libraries load in a slightly different way.

With the first script, we're negating the condition that the libraries use to detect if there's a loader in the system, thus forcing them to load in the usual way (global). In the second script, we're resetting the system back to the default, just to play nice and leave everything the same way we found it ;)

Pikachu kute, modifié il y a 7 années.

RE: Include JavaScript Library in Liferay 7

New Member Publications: 13 Date d'inscription: 09/03/17 Publications récentes

Chema Balsas:

Hey Pikachu!

The main problem you were having including the library is that Liferay 7 ships with an AMD Loader. This makes some libraries load in a slightly different way.

With the first script, we're negating the condition that the libraries use to detect if there's a loader in the system, thus forcing them to load in the usual way (global). In the second script, we're resetting the system back to the default, just to play nice and leave everything the same way we found it ;)

Thanks you a lot! Chema Balsas. emoticon

Pikachu kute, modifié il y a 7 années.

RE: Include JavaScript Library in Liferay 7

New Member Publications: 13 Date d'inscription: 09/03/17 Publications récentes

Chema Balsas:

The Using External Libraries tutorial in the Developer Network probably has the answer you're looking for.

If you're on DXP after FixPack-8 you can simply turn off the amd loader so plugins will load as you expect them again. In case you're in GA3, some workarounds are also provided.

Hope it helps!

I followed that tutorial but not understand clearly, could you share me some example, thanks