Java: How to set a value from javascript to a wicket component textfield

F.K.

I am using javascript to get a value from client-side using a button that is not binded to a wicket component (i.e., it doesn't have a wicket-id). Now, I need to set that value to a textfield (textarea) - that is a wicket-component, but unable to do that. If I set value in a simple textarea (not a wicket component) then it works fine. But I need that value in the wicket component so that I can get its value when the form submits.

Javascript isn't working on the wicket component.

Javascript method:

var text2 = document.getElementById("e2");
var text1 = document.getElementById("e1");
text1.value = "hello";
text2.value = "hello";

html:

<wicket:panel>
<form wicket:id="form" id="form" onsubmit="submit(event,this);">
<div wicket:id="myPanel">

   <input type="button" value="Verify" name="B3" onclick=GetTemplate() />

   <p><textarea name="S2" id="e2"></textarea></p>

   <p><textarea wicket:id="e1" name="S1" id="e1" ></textarea></p>

   <input type="submit" class="submitForm" wicket:id="submit" wicket:message="value:Submit" name="submit" />

</div>
</form>
</wicket:panel>

Java:

public class MyPanel  extends Panel {
 public MyPanel(...){
   ...
   Form<?> form = new Form("form", new Model());
   container = new WebMarkupContainer("myPanel");

   textArea = new TextArea<String>("e1", new Model());
   textArea.setEnabled(true).setOutputMarkupId(true).
   textArea.setOutputMarkupPlaceholderTag(true);
   textArea.setEscapeModelStrings(false);
   textArea.add(new ErrorIndicator());

   submitButton = (Button) new Button("submit") {
            private static final long serialVersionUID = 1L;

            @Override
            public void onSubmit() {
                message = textArea.getModelObject();
            }
        }.setEnabled(true);
   container.add(textArea);
   container.add(submitButton);
   form.add(container);
   add(form);
 }

Here, I can set value in the textarea id=e2 but not on id=e1.

RobAu

The problem come from this line:

 textArea.setEnabled(true).setOutputMarkupId(true)

This will generate a custom id for the TEXTAREA (for Wicket Ajax). So, the id is changed and your javascript won't work anymore, because that uses the 'e1' id that is replaced.

You can add a custom data-attribute and get the component by that attribute.

For example:

 <p><textarea wicket:id="e1" name="S1" data-id="e1" ></textarea></p>

And then (for example, using jquery, something like this)

  $("TEXTAREA[data-id='e1']").val("hello");

Or, if you don't need ajax, skip calling the setOutputMarkupId

Collected from the Internet

Please contact [email protected] to delete if infringement.

edited at
0

Comments

0 comments
Login to comment

Related

Wicket : Manually set value of a DateTextField

How do I call Java code from JavaScript code in Wicket?

How to remove a CSS class from a Wicket component?

Set focus on a component with Apache Wicket?

How can I correctly remove an AjaxSelfUpdatingTimerBehavior from a component in Apache Wicket?

Wicket : how to set checked value in CheckBoxMultipleChoice

(Apache Wicket) Set java atrribute from a js function

How to set value to default choice in Wicket DropDownChoice

Deriving value from textfield to javascript(DOM issue)!

How to set grouped TextField value to the state?

Set TemplateRef value from component

Set value of TextField from another window in javafx

How do you set the value of a TextField from Dropdown Selection?

Set Child Component TextField's Value to Parent Components Dropdown Selection?

How to pass value to props from component and set state

How to set default value for Wicket DropDownChoice

How to validate number format TextField in wicket?

how to show datetimepicker and set the chosen value in textfield

Java Swing - How to get the value of text in a TextField from another class

How to set the value of a component to a number

Call Wicket 6 Code from Javascript and return value

Set value of textfield with javascript

How to set value to second page textfield from Main page textfield

How to set value of a Date Textfield in Material UI

how to set value style in center (at TextField Flutter)

How to set and get TextField value using as props of functional component in react js?

How to set dynamic value in a useState from parent component

How to Set Value in Formik from custom component in react native

How to set a default value for a Select component from react with MenuItem as options