java - Apache Wicket : Onclick of a form button, 我需要调用一个小的 javascript 函数

Question

单击表单按钮时，我需要调用一个小的 javascript 函数。此 javascript 函数应验证相同表单中的某些字段，然后调用 java 中表单的 onSubmit()。

主要思想是让验证发生在客户端而不是在 java 中。

完整的想法:

我有如下所示的 help.html 文件:

<form wicket:id="form">
      <input type="text" wicket:id="one"/>
      <input type="text" wicket:id="two"/>
      <input type="submit" wicket:id="save"/>
</form>

在 help.java 中，我创建了一个 WebMarkupContainer 并添加了这个带有提交按钮的表单:

    container.add(new Button("save") {
        @Override
        public void onSubmit() {
             //saved
        }
    });

在 html 中单击按钮时，它会调用 onSubmit()，在这里我们可以对文本框值进行验证。 但我需要在 HTML 页面本身中进行所有验证。

单击保存按钮时，它应该调用一个 javascript 函数，如下所示:

    <form wicket:id="form">
          <input type="text" wicket:id="one"/>
          <input type="text" wicket:id="two"/>
          <input type="submit" wicket:id="save" onclick="validateRange()"/>
    </form>

JavaScript:

    function validateRange(){
          //logic
          //Submit the form
    }

这可以做到吗？

Answer 1

您需要一个 AjaxSubmitLink 或类似的东西。您需要创建一个新的 IAjaxCallListener

public class MyAjaxCallListener implements IAjaxCallListener{

@Override
public CharSequence getBeforeHandler(Component component) {
    return YOUR_JAVA_SCRIPT;
}

@Override
public CharSequence getBeforeSendHandler(Component component) {
    return YOUR_JAVA_SCRIPT;
}

// ...     not needed overrides can return null

}

然后在您的 AjaxSubmitLink 中您可以添加这个 AjaxCallListener

   @Override
   protected void updateAjaxAttributes(AjaxRequestAttributes attributes) {
      super.updateAjaxAttributes(attributes);
      attributes.getAjaxCallListeners().add(new MyAjaxCallListener());
   }