java - 创建嵌入 Textfield 及其 FeedbackPanel 的 Wicket 组件

Question

我写了这段代码:

Java 文件:

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
));

模板文件:

<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>

为了避免冗余，我想创建一个组件(例如:TextFieldWithFeedback)，我可以这样使用:

Java 文件:

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)
));

模板文件:

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

我想创建一个能够管理 TextField 及其反馈面板的 Wicket 组件，我该怎么做？

Answer 1

寻找类(class)FormComponent 。你可以这样做:

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 的工作方式类似于面板，因此您还需要为此类添加自己的 html 文件。然后您可以将此组件添加到表单中。

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