Wicket里面使用Ajax的小例子
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
</head>
<body>
<h4>这里测试Ajax</h4>
<span wicket:id="count"></span>
<br/>
<a wicket:id="ajaxLink">Click</a>
<form wicket:id="ajaxForm">
<span wicket:id="feedback"></span><br/>
name:<input type="text" wicket:id="name"/>
<input type="button" value="test" wicket:id="ajaxButton"/>
</form>
<form wicket:id="dropForm">
<select wicket:id="first"></select>
<select wicket:id="second"></select>
<input type="submit" value="submit"/>
</form>
</body>
</html>
AjaxTest.java
public class AjaxTest extends WebPage{
private int count;
private String name;
private List firstList = new ArrayList();
private List secondList = new ArrayList();
private String first;
private String second;
public AjaxTest(){
//////////////////////测试计算器////////////////////////////
final Label countLabel = new Label("count",new PropertyModel(this,"count"));
//要使用Ajax，必须调用setOutputMarkupId方法输出MarkupId
countLabel.setOutputMarkupId(true);
add(countLabel);
AjaxLink ajaxLink = new AjaxLink("ajaxLink"){
@Override
public void onClick(AjaxRequestTarget target) {
count++;
//一定要给AjaxRequestTarget添加子控件
target.addComponent(countLabel);
}
};
add(ajaxLink);
///////////////////////测试验证表单提交/////////////////////
Form ajaxForm = new Form("ajaxForm",new CompoundPropertyModel(this));
ajaxForm.setOutputMarkupId(true);
add(ajaxForm);
final FeedbackPanel feedback = new FeedbackPanel("feedback");
feedback.setOutputMarkupId(true);
ajaxForm.add(feedback);
TextField nameField = new TextField("name",new PropertyModel(this,"name"));
//设置name的最少长度为4
nameField.add(StringValidator.minimumLength(4));
nameField.setOutputMarkupId(true);
ajaxForm.add(nameField);
//设置一个AjaxFormValidatingBehavior，验证ajaxForm表单，事件为onkeyup
AjaxFormValidatingBehavior behavior = new AjaxFormValidatingBehavior(ajaxForm,"onkeyup"){
@Override
public void onError(AjaxRequestTarget target){
//为AjaxRequestTarget添加子控件
target.addComponent(feedback);
//将错误信息输出到feedback
super.onError(target);
}
};
//每秒向服务器发出请求
behavior.setThrottleDelay(Duration.ONE_SECOND);
//nameField添加了一个AjaxFormValidatingBehavior监听器，事件为onkeyup
nameField.add(behavior);
AjaxSubmitButton ajaxButton = new AjaxSubmitButton("ajaxButton",ajaxForm){
@Override
protected void onSubmit(AjaxRequestTarget target, Form form) {
info("AjaxButton提交！");
}
};
ajaxForm.add(ajaxButton);
/////////////////////测试联动下拉菜单////////////////////
firstList.add("1");firstList.add("2");firstList.add("3");
Form dropForm = new Form("dropForm",new CompoundPropertyModel(this));
dropForm.setOutputMarkupId(true);
add(dropForm);
final DropDownChoice firstDrop = new DropDownChoice("first",new PropertyModel(this,"firstList"));firstDrop.setRequired(true);
firstDrop.setOutputMarkupId(true);
final DropDownChoice secondDrop = new DropDownChoice("second",new PropertyModel(this,"secondList"));
secondDrop.setOutputMarkupId(true);
dropForm.add(firstDrop);
dropForm.add(secondDrop);
//为firstDrop添加AjaxFormComponentUpdatingBehavior监听，事件为onChange
firstDrop.add(new AjaxFormComponentUpdatingBehavior("onChange"){
@Override
protected void onUpdate(AjaxRequestTarget target) {
getSecondList().clear();
int index = Integer.parseInt((String)firstDrop.getModelObject());
for(int i=1;i<=4;i++){
getSecondList().add(String.valueOf(index*10+i));
}
//为AjaxRequestTarget添加子控件
target.addComponent(secondDrop);
}
});
}
public int getCount() {
return count;
}
public void setCount(int count) {
this.count = count;
}
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
public List getSecondList() {
return secondList;
}
public void setSecondList(List secondList) {
this.secondList = secondList;
}
public List getFirstList() {
return firstList;
}
public void setFirstList(List firstList) {
this.firstList = firstList;
}
public String getFirst() {
return first;
}
public void setFirst(String first) {
this.first = first;
}
public String getSecond() {
return second;
}
public void setSecond(String second) {
this.second = second;
}
}