You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@wicket.apache.org by avchavan <av...@yahoo.co.in> on 2015/02/18 12:48:06 UTC
Jquery methods issue with wicket 6.13
My Java code:
@Override
public void renderHead(IHeaderResponse response) {
// add jQuery library
response.render(JavaScriptHeaderItem.forReference(Application.get().getJavaScriptLibrarySettings().getJQueryReference()));
// set focus to the username on load - check that the field exists
response.render(JavaScriptHeaderItem.forScript("$('#accordion').accordion();","onready-master"));
}
My HTML:
<html xmlns:wicket="http://wicket.apache.org">
<wicket:head></wicket:head>
<body>
<div id="accordion">
Section 1
<div>
<p>
Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam.
Integer ut neque. Vivamus nisi metus, molestie vel, gravida in,
condimentum sit amet, nunc. Nam a nibh. Donec suscipit eros.
Nam mi. Proin viverra leo ut odio. Curabitur malesuada. Vestibulum
a velit eu ante scelerisque vulputate.
</p>
</div>
Section 2
<div>
<p>
Sed non urna. Donec et ante. Phasellus eu ligula. Vestibulum sit amet
purus. Vivamus hendrerit, dolor at aliquet laoreet, mauris turpis
porttitor
velit, faucibus interdum tellus libero ac justo. Vivamus non quam. In
suscipit faucibus urna.
</p>
</div>
Section 3
<div>
<p>
Nam enim risus, molestie et, porta ac, aliquam ac, risus. Quisque
lobortis.
Phasellus pellentesque purus in massa. Aenean in pede. Phasellus ac
libero
ac tellus pellentesque semper. Sed ac felis. Sed commodo, magna quis
lacinia ornare, quam ante aliquam nisi, eu iaculis leo purus venenatis
dui.
</p>
<ul>
<li>List item one</li>
<li>List item two</li>
<li>List item three</li>
</ul>
</div>
Section 4
<div>
<p>
Cras dictum. Pellentesque habitant morbi tristique senectus et netus
et malesuada fames ac turpis egestas. Vestibulum ante ipsum primis in
faucibus orci luctus et ultrices posuere cubilia Curae; Aenean lacinia
mauris vel est.
</p>
<p>
Suspendisse eu nisl. Nullam ut libero. Integer dignissim consequat
lectus.
Class aptent taciti sociosqu ad litora torquent per conubia nostra, per
inceptos himenaeos.
</p>
</div>
</div>
</body>
</html>
When i try to run the above code i get javascript error saying:
Object doesn't support this property or method. for line 8 (the Jquery code
for accordion)
Rendered HTML:
<html xmlns:wicket="http://wicket.apache.org">
<head>
</head>
<body>
<div id="accordion">
Section 1
<div>
<p>
Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam.
Integer ut neque. Vivamus nisi metus, molestie vel, gravida in,
condimentum sit amet, nunc. Nam a nibh. Donec suscipit eros.
Nam mi. Proin viverra leo ut odio. Curabitur malesuada. Vestibulum
a velit eu ante scelerisque vulputate.
</p>
</div>
Section 2
<div>
<p>
Sed non urna. Donec et ante. Phasellus eu ligula. Vestibulum sit amet
purus. Vivamus hendrerit, dolor at aliquet laoreet, mauris turpis
porttitor
velit, faucibus interdum tellus libero ac justo. Vivamus non quam. In
suscipit faucibus urna.
</p>
</div>
Section 3
<div>
<p>
Nam enim risus, molestie et, porta ac, aliquam ac, risus. Quisque
lobortis.
Phasellus pellentesque purus in massa. Aenean in pede. Phasellus ac
libero
ac tellus pellentesque semper. Sed ac felis. Sed commodo, magna quis
lacinia ornare, quam ante aliquam nisi, eu iaculis leo purus venenatis
dui.
</p>
<ul>
<li>List item one</li>
<li>List item two</li>
<li>List item three</li>
</ul>
</div>
Section 4
<div>
<p>
Cras dictum. Pellentesque habitant morbi tristique senectus et netus
et malesuada fames ac turpis egestas. Vestibulum ante ipsum primis in
faucibus orci luctus et ultrices posuere cubilia Curae; Aenean lacinia
mauris vel est.
</p>
<p>
Suspendisse eu nisl. Nullam ut libero. Integer dignissim consequat
lectus.
Class aptent taciti sociosqu ad litora torquent per conubia nostra, per
inceptos himenaeos.
</p>
</div>
</div>
</body>
</html>
--
View this message in context: http://apache-wicket.1842946.n4.nabble.com/Jquery-methods-issue-with-wicket-6-13-tp4669599.html
Sent from the Users forum mailing list archive at Nabble.com.
---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org
Re: Jquery methods issue with wicket 6.13
Posted by Sebastien <se...@gmail.com>.
That's means that jQuery itself is not available when you need it (ie:
$('#accordion'))
Still using firebug, check whether libraries are well added to the page (ie
you don't have a 404 instead of the file content)
Furthermore it is not a good practice to include jquery.js by yourself
using this manner, it may conflict with the wicket's shipped one.
If you need to have a custom version of jQuery, see Application#init() {
this.getJavaScriptLibrarySettings().setJQueryReference(myJQueryReference) }
and later use
MyApplication.get().getJavaScriptLibrarySettings().getJQueryReference() (if
you are not using JQueryPluginResourceReference)
To complete the loop, it is better to use PriorityHeaderItem for adding
these references to be sure these will be rendered before your call...
Best regards,
Sebastien.
On Wed, Feb 18, 2015 at 2:35 PM, avchavan <av...@yahoo.co.in>
wrote:
> Used firebug.
> I get the following error:
>
> ReferenceError: $ is not defined
>
> @Override
> public void renderHead(IHeaderResponse response) {
> // add jQuery library
>
> response.render(CssHeaderItem.forUrl("
> https://code.jquery.com/ui/1.11.3/themes/smoothness/jquery-ui.css"));
>
> response.render(JavaScriptHeaderItem.forUrl("
> https://code.jquery.com/jquery-1.10.2.js"));
>
> response.render(JavaScriptHeaderItem.forUrl("
> https://code.jquery.com/ui/1.11.3/jquery-ui.js"));
>
>
> response.render(JavaScriptHeaderItem.forScript("$('#accordion').accordion();","onready-master"));
> }
>
> --
> View this message in context:
> http://apache-wicket.1842946.n4.nabble.com/Jquery-methods-issue-with-wicket-6-13-tp4669599p4669608.html
> Sent from the Users forum mailing list archive at Nabble.com.
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
> For additional commands, e-mail: users-help@wicket.apache.org
>
>
Re: Jquery methods issue with wicket 6.13
Posted by avchavan <av...@yahoo.co.in>.
Used firebug.
I get the following error:
ReferenceError: $ is not defined
@Override
public void renderHead(IHeaderResponse response) {
// add jQuery library
response.render(CssHeaderItem.forUrl("https://code.jquery.com/ui/1.11.3/themes/smoothness/jquery-ui.css"));
response.render(JavaScriptHeaderItem.forUrl("https://code.jquery.com/jquery-1.10.2.js"));
response.render(JavaScriptHeaderItem.forUrl("https://code.jquery.com/ui/1.11.3/jquery-ui.js"));
response.render(JavaScriptHeaderItem.forScript("$('#accordion').accordion();","onready-master"));
}
--
View this message in context: http://apache-wicket.1842946.n4.nabble.com/Jquery-methods-issue-with-wicket-6-13-tp4669599p4669608.html
Sent from the Users forum mailing list archive at Nabble.com.
---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org
Re: Jquery methods issue with wicket 6.13
Posted by Sebastien <se...@gmail.com>.
Hi,
You need to ensure the libraries are well added to the page, using firebug
or equivalent. Maybe so you have an Url issue. (I suppose it should begins
with http:// for begin non relative)
Best regards,
Sebastien.
On Wed, Feb 18, 2015 at 2:08 PM, avchavan <av...@yahoo.co.in>
wrote:
> i used this:
>
> @Override
> public void renderHead(IHeaderResponse response) {
> // add jQuery library
>
> response.render(CssHeaderItem.forUrl("//
> code.jquery.com/ui/1.11.3/themes/smoothness/jquery-ui.css"));
>
> response.render(JavaScriptHeaderItem.forUrl("//
> code.jquery.com/jquery-1.10.2.js"));
>
> response.render(JavaScriptHeaderItem.forUrl("//
> code.jquery.com/ui/1.11.3/jquery-ui.js"));
>
>
> response.render(JavaScriptHeaderItem.forScript("$('#accordion').accordion();","onready-master"));
> }
>
> but still no effect.
>
> --
> View this message in context:
> http://apache-wicket.1842946.n4.nabble.com/Jquery-methods-issue-with-wicket-6-13-tp4669599p4669603.html
> Sent from the Users forum mailing list archive at Nabble.com.
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
> For additional commands, e-mail: users-help@wicket.apache.org
>
>
Re: Jquery methods issue with wicket 6.13
Posted by Martin Grigorov <mg...@apache.org>.
On Wed, Feb 18, 2015 at 4:00 PM, avchavan <av...@yahoo.co.in>
wrote:
> Hi Martin,
>
> Did the changes as you had said.
>
> getting the following error:
> TypeError: $(...).accordion is not a function
>
Good. jQuery is loaded.
> $('#accordion').accordion();
>
Now jQuery-UI seems to be not loaded for some reason.
>
> @Override
> public void renderHead(IHeaderResponse response) {
> // add jQuery library
>
> response.render(CssHeaderItem.forUrl("
> https://code.jquery.com/ui/1.11.3/themes/smoothness/jquery-ui.css"));
>
> response.render(JavaScriptHeaderItem.forUrl("
> https://code.jquery.com/jquery-1.11.2.js"));
>
> response.render(JavaScriptHeaderItem.forUrl("
> https://code.jquery.com/ui/1.11.3/jquery-ui.js"));
>
>
> response.render(OnDomReadyHeaderItem.forScript("$('#accordion').accordion()"));
> }
>
> --
> View this message in context:
> http://apache-wicket.1842946.n4.nabble.com/Jquery-methods-issue-with-wicket-6-13-tp4669599p4669609.html
> Sent from the Users forum mailing list archive at Nabble.com.
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
> For additional commands, e-mail: users-help@wicket.apache.org
>
>
Re: Jquery methods issue with wicket 6.13
Posted by avchavan <av...@yahoo.co.in>.
Hi Martin,
Did the changes as you had said.
getting the following error:
TypeError: $(...).accordion is not a function
$('#accordion').accordion();
@Override
public void renderHead(IHeaderResponse response) {
// add jQuery library
response.render(CssHeaderItem.forUrl("https://code.jquery.com/ui/1.11.3/themes/smoothness/jquery-ui.css"));
response.render(JavaScriptHeaderItem.forUrl("https://code.jquery.com/jquery-1.11.2.js"));
response.render(JavaScriptHeaderItem.forUrl("https://code.jquery.com/ui/1.11.3/jquery-ui.js"));
response.render(OnDomReadyHeaderItem.forScript("$('#accordion').accordion()"));
}
--
View this message in context: http://apache-wicket.1842946.n4.nabble.com/Jquery-methods-issue-with-wicket-6-13-tp4669599p4669609.html
Sent from the Users forum mailing list archive at Nabble.com.
---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org
Re: Jquery methods issue with wicket 6.13
Posted by Martin Grigorov <mg...@apache.org>.
On Wed, Feb 18, 2015 at 3:08 PM, avchavan <av...@yahoo.co.in>
wrote:
> i used this:
>
> @Override
> public void renderHead(IHeaderResponse response) {
> // add jQuery library
>
> response.render(CssHeaderItem.forUrl("//
> code.jquery.com/ui/1.11.3/themes/smoothness/jquery-ui.css"));
>
> response.render(JavaScriptHeaderItem.forUrl("//
> code.jquery.com/jquery-1.10.2.js"));
>
There is a newer version of jQuery. I think JQuery UI 1.11.x depends on
fixes in JQuery 1.11.x
>
> response.render(JavaScriptHeaderItem.forUrl("//
> code.jquery.com/ui/1.11.3/jquery-ui.js"));
>
>
> response.render(JavaScriptHeaderItem.forScript("$('#accordion').accordion();","onready-master"));
>
Use OnDomReadyHeaderItem.forScript() instead.
> }
>
> but still no effect.
>
> --
> View this message in context:
> http://apache-wicket.1842946.n4.nabble.com/Jquery-methods-issue-with-wicket-6-13-tp4669599p4669603.html
> Sent from the Users forum mailing list archive at Nabble.com.
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
> For additional commands, e-mail: users-help@wicket.apache.org
>
>
Re: Jquery methods issue with wicket 6.13
Posted by avchavan <av...@yahoo.co.in>.
i used this:
@Override
public void renderHead(IHeaderResponse response) {
// add jQuery library
response.render(CssHeaderItem.forUrl("//code.jquery.com/ui/1.11.3/themes/smoothness/jquery-ui.css"));
response.render(JavaScriptHeaderItem.forUrl("//code.jquery.com/jquery-1.10.2.js"));
response.render(JavaScriptHeaderItem.forUrl("//code.jquery.com/ui/1.11.3/jquery-ui.js"));
response.render(JavaScriptHeaderItem.forScript("$('#accordion').accordion();","onready-master"));
}
but still no effect.
--
View this message in context: http://apache-wicket.1842946.n4.nabble.com/Jquery-methods-issue-with-wicket-6-13-tp4669599p4669603.html
Sent from the Users forum mailing list archive at Nabble.com.
---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org
Re: Jquery methods issue with wicket 6.13
Posted by Sebastien <se...@gmail.com>.
Hi,
This is because #accordion is part of jQuery UI, not jQuery (the underlying
javascript library)
You need to render jQuery UI resource references (js & css), make the
jquery-ui.js resource reference extends JQueryPluginResourceReference so
you don't have to explicitly add the dependency to jquery.js
You can also use Wicket jQuery UI:
http://www.7thweb.net/wicket-jquery-ui/accordion/DefaultAccordionPage
Hope this helps,
Sebastien.
2015-02-18 12:48 GMT+01:00 avchavan <av...@yahoo.co.in>:
> My Java code:
>
> @Override
> public void renderHead(IHeaderResponse response) {
> // add jQuery library
>
>
> response.render(JavaScriptHeaderItem.forReference(Application.get().getJavaScriptLibrarySettings().getJQueryReference()));
> // set focus to the username on load - check that the field
> exists
>
>
> response.render(JavaScriptHeaderItem.forScript("$('#accordion').accordion();","onready-master"));
> }
>
> My HTML:
>
> <html xmlns:wicket="http://wicket.apache.org">
> <wicket:head></wicket:head>
> <body>
> <div id="accordion">
> Section 1
>
> <div>
> <p>
> Mauris mauris ante, blandit et, ultrices a,
> suscipit eget, quam.
> Integer ut neque. Vivamus nisi metus, molestie
> vel, gravida in,
> condimentum sit amet, nunc. Nam a nibh. Donec
> suscipit eros.
> Nam mi. Proin viverra leo ut odio. Curabitur
> malesuada. Vestibulum
> a velit eu ante scelerisque vulputate.
> </p>
> </div>
>
> Section 2
>
> <div>
> <p>
> Sed non urna. Donec et ante. Phasellus eu ligula.
> Vestibulum sit amet
> purus. Vivamus hendrerit, dolor at aliquet
> laoreet, mauris turpis
> porttitor
> velit, faucibus interdum tellus libero ac justo.
> Vivamus non quam. In
> suscipit faucibus urna.
> </p>
> </div>
>
> Section 3
>
> <div>
> <p>
> Nam enim risus, molestie et, porta ac, aliquam ac,
> risus. Quisque
> lobortis.
> Phasellus pellentesque purus in massa. Aenean in
> pede. Phasellus ac
> libero
> ac tellus pellentesque semper. Sed ac felis. Sed
> commodo, magna quis
> lacinia ornare, quam ante aliquam nisi, eu iaculis
> leo purus venenatis
> dui.
> </p>
> <ul>
> <li>List item one</li>
> <li>List item two</li>
> <li>List item three</li>
> </ul>
> </div>
>
> Section 4
>
> <div>
> <p>
> Cras dictum. Pellentesque habitant morbi tristique
> senectus et netus
> et malesuada fames ac turpis egestas. Vestibulum
> ante ipsum primis in
> faucibus orci luctus et ultrices posuere cubilia
> Curae; Aenean lacinia
> mauris vel est.
> </p>
> <p>
> Suspendisse eu nisl. Nullam ut libero. Integer
> dignissim consequat
> lectus.
> Class aptent taciti sociosqu ad litora torquent
> per conubia nostra, per
> inceptos himenaeos.
> </p>
> </div>
> </div>
> </body>
> </html>
>
> When i try to run the above code i get javascript error saying:
> Object doesn't support this property or method. for line 8 (the Jquery code
> for accordion)
>
> Rendered HTML:
>
> <html xmlns:wicket="http://wicket.apache.org">
> <head>
>
> </head>
> <body>
> <div id="accordion">
> Section 1
>
> <div>
> <p>
> Mauris mauris ante, blandit et, ultrices a,
> suscipit eget, quam.
> Integer ut neque. Vivamus nisi metus, molestie
> vel, gravida in,
> condimentum sit amet, nunc. Nam a nibh. Donec
> suscipit eros.
> Nam mi. Proin viverra leo ut odio. Curabitur
> malesuada. Vestibulum
> a velit eu ante scelerisque vulputate.
> </p>
> </div>
>
> Section 2
>
> <div>
> <p>
> Sed non urna. Donec et ante. Phasellus eu ligula.
> Vestibulum sit amet
> purus. Vivamus hendrerit, dolor at aliquet
> laoreet, mauris turpis
> porttitor
> velit, faucibus interdum tellus libero ac justo.
> Vivamus non quam. In
> suscipit faucibus urna.
> </p>
> </div>
>
> Section 3
>
> <div>
> <p>
> Nam enim risus, molestie et, porta ac, aliquam ac,
> risus. Quisque
> lobortis.
> Phasellus pellentesque purus in massa. Aenean in
> pede. Phasellus ac
> libero
> ac tellus pellentesque semper. Sed ac felis. Sed
> commodo, magna quis
> lacinia ornare, quam ante aliquam nisi, eu iaculis
> leo purus venenatis
> dui.
> </p>
> <ul>
> <li>List item one</li>
> <li>List item two</li>
> <li>List item three</li>
> </ul>
> </div>
>
> Section 4
>
> <div>
> <p>
> Cras dictum. Pellentesque habitant morbi tristique
> senectus et netus
> et malesuada fames ac turpis egestas. Vestibulum
> ante ipsum primis in
> faucibus orci luctus et ultrices posuere cubilia
> Curae; Aenean lacinia
> mauris vel est.
> </p>
> <p>
> Suspendisse eu nisl. Nullam ut libero. Integer
> dignissim consequat
> lectus.
> Class aptent taciti sociosqu ad litora torquent
> per conubia nostra, per
> inceptos himenaeos.
> </p>
> </div>
> </div>
> </body>
> </html>
>
>
> --
> View this message in context:
> http://apache-wicket.1842946.n4.nabble.com/Jquery-methods-issue-with-wicket-6-13-tp4669599.html
> Sent from the Users forum mailing list archive at Nabble.com.
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
> For additional commands, e-mail: users-help@wicket.apache.org
>
>