Jquery In portlet

[ali hosseini, modificado 9 Anos atrás.]

Hello, you're not tired
I want to be a part of your portlet using jQuery to search write.
However, I can not jQuery libraries to add my own portlets.
I have the following in my files for this job, but the problem did not read the files in the directory /webapp/js/ And /webapp/css/ I have.
In View Portlet, in Section <h:head> </h:head>

	<link rel="stylesheet" href="css/token-input.css" type="text/css">
	<script type="text/javascript" src="js/jquery.js"></script>
	<script type="text/javascript" src="js/jquery.tokeninput.js"></script>

OR

	<link rel="stylesheet" href="/css/token-input.css" type="text/css">
	<script type="text/javascript" src="/js/jquery.js"></script>
	<script type="text/javascript" src="/js/jquery.tokeninput.js"></script>

OR

	<link rel="stylesheet" href="../css/token-input.css" type="text/css">
	<script type="text/javascript" src="../js/jquery.js"></script>
	<script type="text/javascript" src="../js/jquery.tokeninput.js"></script>

And liferay-portlet.xml :

		
                <header-portlet-css>/css/token-input.css</header-portlet-css>
		<header-portlet-javascript>/js/jquery.js</header-portlet-javascript>
		<header-portlet-javascript>/js/jquery.tokeninput.js</header-portlet-javascript>

My Error Is:

07:46:53,753 INFO  [stdout] (http--127.0.0.1-8080-5) 07:46:53,753 WARN  [http--127.0.0.1-8080-5][code_jsp:117] {code="404", msg="/css/token-input.css", uri=/css/token-input.css}
07:46:53,755 INFO  [stdout] (http--127.0.0.1-8080-5) 07:46:53,755 WARN  [http--127.0.0.1-8080-5][code_jsp:117] {code="404", msg="/js/jquery.js", uri=/js/jquery.js}
07:46:53,758 INFO  [stdout] (http--127.0.0.1-8080-5) 07:46:53,758 WARN  [http--127.0.0.1-8080-5][code_jsp:117] {code="404", msg="/js/jquery.tokeninput.js", uri=/js/jquery.tokeninput.js}
07:46:54,367 INFO  [stdout] (http--127.0.0.1-8080-5) 07:46:54,367 WARN  [http--127.0.0.1-8080-5][code_jsp:117] {code="404", msg="/css/token-input.css", uri=/css/token-input.css}
07:46:54,368 INFO  [stdout] (http--127.0.0.1-8080-6) 07:46:54,367 WARN  [http--127.0.0.1-8080-6][code_jsp:117] {code="404", msg="/js/jquery.js", uri=/js/jquery.js}
07:46:54,402 INFO  [stdout] (http--127.0.0.1-8080-5) 07:46:54,402 WARN  [http--127.0.0.1-8080-5][code_jsp:117] {code="404", msg="/js/jquery.tokeninput.js", uri=/js/jquery.tokeninput.js}

Please help.

[Kyle Joseph Stiemann, modificado 9 Anos atrás.]

Hi Ali,
It looks you are getting a 404 and the server cannot find your jquery resources. Could you try following the example of our demos and including your resources under src/main/webapp/resources in css and js folders respectively? Then you should be able to obtain them with the following code:

<h:outputStyleSheet library="css" name="token-input.css" target="head" />
<h:outputScript library="js" name="jquery.js" target="head" />
<h:outputScript library="js" name="jquery.tokeninput.js" target="head" />

- Kyle

[ali hosseini, modificado 9 Anos atrás.]

hello Kyle
I've tested with the way you said it, but I did not get any answer.
Even with the script did not work either.
Here's a picture of my project.

[Kyle Joseph Stiemann, modificado 9 Anos atrás.]

Hi Ali,

You still need to change your <script>s to <h:outputScript>s and your CSS <link>s to <h:outputStyleSheet>s as shown in my post above.

- Kyle

[ali hosseini, modificado 9 Anos atrás.]

Hi there
I have tried this way also.
But did not get any error, but the file will not run jQuery.

	<h:outputscript name="jquery.js" library="js" target="head" />
	<h:outputscript name="jquery.tokeninput.js" library="js" target="head" />
	<h:outputstylesheet name="token-input.css" library="css" target="head" />

[Kyle Joseph Stiemann, modificado 9 Anos atrás.]

Is jquery.js included correctly in the page? If you open browser dev tools, can you find the <script> tag with jquery.js in it? If so, try opening the link and see if it correctly displays the js file.

Also could you elaborate on this statement?

but the file will not run jQuery.

- Kyle

[ali hosseini, modificado 9 Anos atrás.]

this my project
any help...

[ali hosseini, modificado 9 Anos atrás.]

No one can help me in this project?

[Kyle Joseph Stiemann, modificado 9 Anos atrás.]

Hi Ali,
I was able to get your portlet working by replacing $ with jQuery to avoid conflicts with AlloyUI.

- Kyle

[David H Nebinger, modificado 9 Anos atrás.]

Kyle aren't you then using the primefaces jQuery, not the one the op wanted to use?

[ali hosseini, modificado 9 Anos atrás.]

Hello and thanks for your answer
How did you do it?
Please put the file containing the changes.
Thank you

[Kyle Joseph Stiemann, modificado 9 Anos atrás.]

ali hosseini:

How did you do it?
Please put the file containing the changes.

Hi Ali,
As I said before, I simply replaced $ with jQuery (s/[$]/jQuery/g).

I also noticed that your project had some other issues:

1. You are including both PrimeFaces and IceFaces in the project and the same page, but they will conflict. Most likely you only need one or the other.
2. You are including your resources twice: once in the liferay-portlet.xml in the <header-portlet-javascript> and <header-portlet-css> and once on the page as an h:outputScript or h:outputStyleSheet. Do one or the other, not both.

- Kyle

[Kyle Joseph Stiemann, modificado 9 Anos atrás.]

@David,
There aren't any primefaces components on the page (so the primefaces jquery is not included),* so the jquery.js is included from the resources/ folder.

- Kyle


* But just for sanity's sake I removed the unused primefaces namespace and retested.

[David H Nebinger, modificado 9 Anos atrás.]

Dude, it's all your fault.

You're trying to pull in resources like /js/jquery.js, but if you look at your project the path is /resources/js/jquery.js. Same with all of the other 404s. Fix your paths, basically root is webapps, so "/icon.png" in your project is /src/main/webapp/icon.png.

[ali hosseini, modificado 9 Anos atrás.]

change path to root webapp:

	<script type="text/javascript" src="/jquery.js"></script>
	<script type="text/javascript" src="/jquery-tokeninput.js"></script>
	<link href="/token-input.css" rel="stylesheet" type="text/css">

Erro :

07:10:52,344 INFO  [stdout] (http--127.0.0.1-8080-3) 07:10:52,344 WARN  [http--127.0.0.1-8080-3][code_jsp:117] {code="404", msg="/jquery.js", uri=/jquery.js}
07:10:52,350 INFO  [stdout] (http--127.0.0.1-8080-3) 07:10:52,349 WARN  [http--127.0.0.1-8080-3][code_jsp:117] {code="404", msg="/jquery-tokeninput.js", uri=/jquery-tokeninput.js}
07:10:52,352 INFO  [stdout] (http--127.0.0.1-8080-3) 07:10:52,352 WARN  [http--127.0.0.1-8080-3][code_jsp:117] {code="404", msg="/token-input.css", uri=/token-input.css}
07:10:53,018 INFO  [stdout] (http--127.0.0.1-8080-1) 07:10:53,018 WARN  [http--127.0.0.1-8080-1][code_jsp:117] {code="404", msg="/jquery.js", uri=/jquery.js}
07:10:53,055 INFO  [stdout] (http--127.0.0.1-8080-1) 07:10:53,054 WARN  [http--127.0.0.1-8080-1][code_jsp:117] {code="404", msg="/jquery-tokeninput.js", uri=/jquery-tokeninput.js}
07:10:53,064 INFO  [stdout] (http--127.0.0.1-8080-1) 07:10:53,064 WARN  [http--127.0.0.1-8080-1][code_jsp:117] {code="404", msg="/token-input.css", uri=/token-input.css}

[David H Nebinger, modificado 9 Anos atrás.]

Not in the online source code you didn't.