小门：动态添加TextField / Panel

Question

我想将一些TextField动态添加到表单中，并隐藏或显示一些onClick。

我想实现为图像的东西（实际上是德语，所以我要解释一下）：在左侧是一周中的几天（星期一，星期二，...，星期日）。 如果您用向右方向的箭头单击按钮，则实际的一周应隐藏起来，并显示下一周。

我存储了一个代表周期的Integer 。 因此，如果数据库中的数字为3，则我需要能够在“下周”按钮上单击3次。 （注意：此数字可以动态更改）。 因此，如果我将数字3更改为5，则需要此表格的5倍。

我希望我把它描述为“好”，我的英语不是最好的。 抱歉

我读过的内容：首先，我需要在其中添加TextFields的面板，其次，我需要一个获取面板列表的ListView。 但是我不知道它是如何工作的。.这是正确的方法吗？

FormPanel：

public class FoodFieldPanel extends Panel {

public FoodFieldPanel(String id) {
    super(id);
    WebMarkupContainer foodFields = new WebMarkupContainer("foodFields");
    TextField monday = new TextField("monday");
    TextField tuesday = new TextField("tuesday");
    TextField wendnesday = new TextField("wendnesday");
    TextField thursday = new TextField("thursday");
    TextField friday = new TextField("friday");
    TextField saturday = new TextField("saturday");
    TextField sunday = new TextField("sunday");
    foodFields.add(monday);
    foodFields.add(tuesday);
    foodFields.add(wendnesday);
    foodFields.add(thursday);
    foodFields.add(friday);
    foodFields.add(saturday);
    foodFields.add(sunday);
    add(foodFields);
} 
}

页：

public class FoodDetailPanel extends Panel {

public FoodDetailPanel(String id, final IModel<Category> catModel, boolean fieldsEnabled) {
    super(id, catModel);
    setOutputMarkupId(true);
    int cycle = 4;
    List<FoodFieldPanel> textFields = new ArrayList<FoodFieldPanel>();
    for (int a = 1; a <= cycle; a++) {
        textFields.add(new FoodFieldPanel("foodField"));
    }
    add(new ListView("test", textFields) {
        protected void populateItem(ListItem item) {
            FoodFieldPanel test = (FoodFieldPanel) item.getModelObject();
            add(test);
        }
    });
}
}

MarkupForPage：

<wicket:panel xmlns:wicket="http://wicket.apache.org">
<span wicket:id="test">
    <div wicket:id="foodField">

    </div>
</span> 
</wicket:panel>

第一步，我想根据需要创建面板。

Answer 1

因此，鉴于您的显示是静态的，并且仅需更改其背后的数据，就可以利用模型的强大功能。 （我无法发布完整的解决方案，虽然时间太长，但希望它将向您展示总体思路。）

class WeekData {
   private String monday;
   private String tuesday;
   // and so on
}

class AllData {
  private final int minWeek;
  private final int maxWeek;
  private int currentWeek; // this is modified by clicking the arrows

  private Map<Integer, WeekData> weekMap;

  public IModel<WeekData> createDataModel() {
    return new IModel<WeekData>() {
       public WeekData getObject() {
         return weekMap.get( currentWeek );
       }
    }
  }

  public IModel<Integer> createWeekModel() {
    return new IModel<Integer>() {

       public Integer getObject() {
         return currentWeek;
       }
    }
  }

}

您的FoodFieldPanel初始化将如下所示：

public FoodFieldPanel(String id, IModel<AllData> model) {
  super(id);
  WebMarkupContainer foodFields = new WebMarkupContainer("foodFields", new CompoundPropertyModel( model.getObject().createDataModel() ) );
  TextField monday = new TextField("monday");
  TextField tuesday = new TextField("tuesday");
  //...
  foodFields.add(monday);
  foodFields.add(tuesday);
  //
  add(foodFields);
}

您还需要以类似的方式更改箭头的代码，但是基本思想是，通过使用动态模型，即使在不知道显示代码的情况下，您也可以替换页面后面的数据，甚至不知道逻辑。 而且您不需要额外的ListView 。 （尽管我个人将星期几存储在ListView但我不想进一步使答案复杂化。）

显示器和模型的这种分离是Wicket最强大的功能之一，因此值得您尽可能多地了解它们 。