Wicket 开发笔记（2）针对个别按钮对页面部分表单的 validation
|
- UID
- 1066743
|
Wicket 开发笔记（2）针对个别按钮对页面部分表单的 validation
针对个别按钮对页面部分表单的 validation默认情况下，页面中的 Button 如果设置 validation，会对页面所有表单进行。如果页面中用两个 Button，而一个按钮需要全表单进行 validation，而另一个 Button只需要对表单中的部分 input进行 validation。Button的 setDefaultFormProcessing这个方法虽然可以取消表单的 validation，但是它是会阻止表单数据的提交，所以不是一个好办法。Wicket 一个比较奇妙的地方就是 Form中嵌套 Form，这个似乎在 HTML中是不允许的，但只在 Wicket让这个成为可能，当然最终的 HTML 的实现，Wicket只是把内层的 Form用 DIV来实现，也是个很不错的想法。如清单 5 所示。
清单 5. Html 中嵌套 Form 的定义代码及 Java 实现代码1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
| <form wicket:id="outerform">
<input type="text"wicket:id="location">
<input type="text"wicket:id="license">
<form wicket:id="innerForm">
<input class="btn"type="submit"wicket:id="AddHost" value="AddHost">
<select wicket:id="type">
</form>
<input class="btn"type="submit" wicket:id="ok" value=" O K "/>
</form>
InputForm form = newInputForm("outerform");
private class InputForm extendsForm<?>
{
add(newTextField<String>("license").setRequired(true));
add(newTextField<String>("location").setRequired(true));
Form<?> innerForm = newForm<?>("innerForm");
innerForm .add(newDropDownChoice<SymphonyPageModel>("type", hostTypeModelList));
innerForm.add(newButton("AddHost")
{
public void onSubmit()
{
// 您会发现现在即使 innnerForm 外面的 input 输入错误
// 也能进来了，在这里您可以做您自己的逻辑了。
}
});
}
|
如何在 Wicket 中使用 AjaxWeb 开发中 Ajax 的使用非常普遍，Wicket 对 Ajax 的支持也做的非常的好，只需要编写 Jave代码就可以实现，html里面不需要任何代码的添加。如下面的这个例子，通过输入的 Host Name 获取对应 Host 的 IP，效果如图 3，代码如清单 6 所示。
清单 6. Ajax 的实现代码1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
| finalTextField<String> hostNameEle = newTextField<String>("name");
finalTextField<String> hostIpEle = newTextField<String>("HostIp");
hostIpEle.setOutputMarkupId(true);// 这句很重要否则会报错。
// 这个就可以对一个控件添加一个 Ajax 事件。
hostNameEle.add(newOnChangeAjaxBehavior() {
@Override
protected void onUpdate(AjaxRequestTarget target)
{
String hostIp = getAddressByHostName(hostNameEle.getValue());
hostIpEle.setModelObject(hostIp);
// 这里设置要对结果进行赋值的控件
target.add(hostIpEle);
}
});
|
图3. Ajax根据输入的host name取得对应的IP 如何修改 DefaultDataTable 里面的某个列的数据像下面的这个 List 我们往往从数据库里检索出来的某些字段是一些代码，而在页面上显示则要显示成代码对应的 message，例如图 4 的 status 字段，数据库中存放的都是 Status(UP, DOWN,UNKONW) 对应的数字代码，那这个时候我们应该怎么实现呢？
图 4. 我们以 DefaultDataTable 为例，只需在添加 Column 时候，重载它的 populateItem 函数，具体例子，如清单 7 所示。
清单 7. DefaultDataTable 的实现代码1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
| List<IColumn<ProductBean>> columns = newArrayList<IColumn<ProductBean>>();
columns.add(newPropertyColumn<ProductBean>(newModel<String>("ClusterName"), "name"));
columns.add(newPropertyColumn<ProductBean>(newModel<String>("Hosts"), "hosts"));
columns.add(newPropertyColumn<ProductBean>(newModel<String>("status"), "status"){
@Override
public void populateItem(Item<ICellPopulator<ProductBean>> item,
String componentId, IModel<ProductBean> rowModel)
{
// 我们就可以在这里改变它的值
item.add(newLabel(componentId, statusInfoMap.get(rowModel.getObject().getStatus())));
}
});
columns.add(newPropertyColumn<ProductBean>(
newModel<String>("shareBinary"), "sharebinary"));
columns.add(newPropertyColumn<ProductBean>(newModel<String>("product"), "product"));
form.add(newDefaultDataTable<ProductBean>
("clusterList", columns, newSortableClusterDataProvide(products), 20));
|
|
|
|
|
|
|
