当 Wicket AjaxFormValidatingBehaviour 验证失败时阻止浏览器表单提交答案

【问题标题】：Prevent browser form submission when Wicket AjaxFormValidatingBehaviour validation fails当 Wicket AjaxFormValidatingBehaviour 验证失败时阻止浏览器表单提交
【发布时间】：2010-04-20 22:20:26
【问题描述】：

我有一个带有向导组件的页面。用户可以使用我执行完整（非 ajax）表单提交的 next 和 previous 按钮导航向导的面板，以便应用程序是后退按钮友好。

当点击 next 按钮时，我想尝试 ajax 表单验证（如果启用了 javascript）。我试着做：

nextButton.add( new AjaxFormValidatingBehavior( form, "onsubmit") );

添加这样的验证。该行为有效 - 但是，当发生验证错误时，浏览器仍会提交整个表单。

在这种情况下，阻止浏览器提交表单的 Wicket 方式是什么？

【问题讨论】：

不能在 WizardStep 中使用 isComplete() 方法吗？我认为，如果您的步骤有效与否，该方法应该返回 true。这应该正确启用/禁用按钮。

标签： java wicket

【解决方案1】：

覆盖表单或AjaxFormValidatingBehavior 上的onError() 方法。如果您对行为这样做，我不确定这是否会阻止表单提交。

new AjaxFormValidatingBehavior( form, "onsubmit") {
   public void onSubmit() {}
   public void onError() {}
}

【讨论】：

谢谢，但是我可以在 onError() 中添加什么来停止提交？似乎在客户端没有阻止完整表单提交发生的脚本。除非没有验证错误，否则我不确定如何防止这种情况发生。我尝试通过返回“return false;”来实现 getFailureScript；试图压制事件，但无济于事。
在表单顶部添加FeedbackPanel。然后在onError() 中将它添加到目标中，以便通过Ajax (target.addComponent(feedbackPanel)) 刷新它。如果存在验证错误，FeedbackPanel 应显示相应的错误消息。您还可以向面板添加自定义消息 (feedbackPanel.error("Validation Error"))

【解决方案2】：

也许有点晚了，但这里是答案：

public class SomePage extends WebPage {

    private FeedbackPanel feedbackMessageError = new FeedbackPanel("feedbackTabAddEmpMesError", new ExactLevelFeedbackMessageFilter(FeedbackMessage.ERROR));

    public SomePage(String id) {

      final Form<Void> form = new Form<>("tabFormAddEmp");
      add(form);

      //Name textfield cannot be empty
      final FormComponent<String> tabAddEmpName = new RequiredTextField<>("tabAddEmpName", Model.of(""));
      tabAddEmpName.setLabel(Model.of("Name"));
      tabAddEmpName.setOutputMarkupId(true);

      //Salarynumber has to be minimal 10 char long
      final FormComponent<String> tabAddEmpLoon = new RequiredTextField<>("tabAddEmpLoon", Model.of(""));
      tabAddEmpLoon.add(new StringValidator(10, null)).setLabel(Model.of("Salarynumber"));
      tabAddEmpLoon.setOutputMarkupId(true);

      final Button button = new Button("tabFormAddEmpBut");

      form.add(tabAddEmpName , tabAddEmpLoon, button);

      button.add(new AjaxFormValidatingBehavior(form, "onclick") {

        @Override
        public void onError(AjaxRequestTarget target) {
             //Add feedbackpanel to your html and voila!
             target.add(feedbackMessageError);
        }

        @Override
        protected void onSubmit(AjaxRequestTarget target) { 
          //Do some logic over here
        }

      }

   }
}

【讨论】：