CODEWITHSUNDEEP
javascriptwicket
Application Developer
Application Developer

Reputation: 3

how to pass the value to the javascript function in wicket

I have a requirement, that every event needs to be captured, like on page load and uiclick. basically i have to display the information in img tag on the page itself which the user cannot see. so for page load i have done with img tag and the src getting from wicket. but in the uiclick event i have to do async call.

I tried like this 

<input type="button" onclick="makeRequest(wicket:id="clickImage",'GET', null, null,'CLICKSTREAM')" name="add"  value="SIGN IN">

but i am getting exceptions

, index = 39, current = [Raw markup]] at org.apache.wicket.markup.AbstractMarkupParser.parseMarkup(AbstractMarkupParser.java:299) at org.apache.wicket.markup.AbstractMarkupParser.parse(AbstractMarkupParser.java:181) at org.apache.wicket.markup.loader.SimpleMarkupLoader.loadMarkup(SimpleMarkupLoader.java:50) at org.apache.wicket.markup.loader.InheritedMarkupMarkupLoader.loadMarkup(InheritedMarkupMarkupLoader.java:55) at org.apache.wicket.markup.loader.DefaultMarkupLoader.loadMarkup(DefaultMarkupLoader.java:51) at org.apache.wicket.markup.MarkupFactory.loadMarkup(MarkupFactory.java:430) at org.apache.wicket.markup.MarkupCache.loadMarkup(MarkupCache.java:442)

Upvotes: 0

Views: 2664

Answers (1)

Xavi L&#243;pez
Xavi L&#243;pez

Reputation: 27880

I'm not sure what you're trying to achieve, but seems like modelling that <input type="button"> with a Wicket Button and attaching a SimpleAttributeModifier or even an Ajax Behavior to it could suit you better, specially if the async request you're making is to your own application.

Using wicket:id in a parameter in a JS function just doesn't make sense. You use wicket:id in HTML to attach a Wicket Component to a tag. If clickImage is just a plain HTML id attribute, just type it as a String.

For instance: 

<input type="text" id="someId"> <!-- Notice this is not a Wicket component -->
<input type="button" wicket:id="buttonComponent" onclick="makeRequest('someId','GET', null, null,'CLICKSTREAM'">

If you don't know beforehand the id because it might be dinamically generated, use setOutputMarkupId(true) in the Component, and model that onclick event handler with a SimpleAttributeModifier. You can get a Component's markup id with getMarkupId().

For instance:

HTML: 

<input type="text" wicket:id="textComponent">
<input type="button" wicket:id="buttonComponent">

Java

TextField txt = new TextField("textComponent");
txt.setOutputMarkupId(true);
txt.setMarkupId("someId"); // Make sure it is unique in the page
Button b = new Button("buttonComponent");
b.add(new SimpleAttributeModifier("onclick", "makeRequest('" + txt.getMarkupId() + "','GET', null, null,'CLICKSTREAM'"));
add(txt);
add(b);

Rendered HTML: 

<input type="text" id="someId">
<input type="button" onclick="makeRequest('someId','GET', null, null,'CLICKSTREAM'">

The second approach is much more powerful given that you can, for instance, add AttributeModifiers to elements inside repeaters so that you can pass only known at runtime, generated ids to a javascript function.

Upvotes: 2

Related Questions