Create Wicket component embedding a Textfield and its FeedbackPanel

Question

I write this code:

Java file:

TextField<String> input1 = (TextField<String>) new TextField<>("input1", Model.of("")).add(new UrlValidator());
TextField<String> input2 = (TextField<String>) new TextField<>("input2", Model.of("")).add(new UrlValidator());
add(new Form<>("form").add(
    new FeedbackPanel("feedbackInput1").setFilter(new ComponentFeedbackMessageFilter(input1)),
    new FeedbackPanel("feedbackInput2").setFilter(new ComponentFeedbackMessageFilter(input2)),
    input1,
    input2
));

Template file:

<form wicket:id="form">
    <!-- first -->
    <div>
        <wicket:panel wicket:id="feedbackInput1" />
        <label for="input1">Input 1:
            <input type="text" wicket:id="input1" id="input1" />
        </label>
    </div>
    <!-- second -->
    <div>
        <wicket:panel wicket:id="feedbackInput2" />
        <label for="input2">Input 2: 
            <input type="text" wicket:id="input2" id="input2" />
        </label>
    </div>

        <div>
            <button type="submit">Submit</button>
        </div>
    </form>

To avoid redundancy, I would like to create a component (eg: TextFieldWithFeedback), I can use like this:

Java file:

TextField<String> input1 = (TextField<String>) new TextField<>("input1", Model.of("")).add(new UrlValidator());
TextField<String> input2 = (TextField<String>) new TextField<>("input2", Model.of("")).add(new UrlValidator());
add(new Form<>("form").add(
    new TextFieldWithFeedback("input1", "Input 1: ", input1),
    new TextFieldWithFeedback("input2", "Input 2: ", input2)
));

Template file:

<form wicket:id="form">
    <!-- first -->
    <div wicket:id="input1" />
    <!-- second -->
    <div wicket:id="input2" />
</form>

I want to create a Wicket component able to manage a TextField and its feedbackPanel, how can I do?

Answer 1

Look for the class FormComponent . You could do something like this:

public class FeedbackTextField<T> extends FormComponent<T> {

    public FeedbackTextField(String id) {
         this(id, null);
    }

    public FeedbackTextField(String id, IModel<T> model) {
         super(id, model);

         TextField<T> tf = new TextField<T>("tx");
         add(tf);
         add(new FeedbackPanel("fb").setFilter(new ComponentFeedbackMessageFilter(tf))); 
    }
}

FormComponent works like a Panel so you need to add you own html file for this class also. Then you can add this component to a form.

form.add(new FeedbackTextField<String>("input1", Model.of("")));