Wicket里面使用Ajax的小例子

最新推荐文章于 2021-08-06 14:28:59 发布

shazhifeng

最新推荐文章于 2021-08-06 14:28:59 发布

阅读量517

点赞数

分类专栏： Wicket 文章标签： wicket Ajax HTML

本文链接：https://blog.csdn.net/shazhifeng/article/details/83334381

版权

Wicket 专栏收录该内容

13 篇文章 0 订阅

订阅专栏

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

shazhifeng

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Wicket里面使用Ajax的小例子

&lt;html&gt;&lt;head&gt; &lt;title&gt;&lt;/title&gt; &lt;meta http-equiv="Content-Type" content="text/html; charset=UTF-8"&gt;&lt;/head&gt;&lt;body&gt; &lt;h4&gt
复制链接

扫一扫