0

我有一个如下的 HTML：

<div>
<form>
  <input type="text" />
  <button class="sendForm" value="Send form" />
</form> 
</div>
<script>
// post the form with Jquery post
// register a callback that handles the response
</script>

我经常将这种类型的表单与显示表单的 JavaScript/JQuery 叠加层一起使用。例如，可以使用FancyBox 之类的插件来处理。我将 Fancybox 用于 Ajax 内容。

我还想使用嵌入到 GWT 视图中的这个表单。让我们假设 for 不能在客户端创建，因为它内部有一些基于服务器的标记语言来设置一些模型数据。

如果我想在 GWT 中使用此表单，我必须执行以下操作。告诉 GWT 表单请求 url 并使用 RequestBuilder 来查询该表单的 html 内容。然后我可以将它插入到 GWT 生成的 div 中。到现在为止还挺好。

问题：

当用户点击发送按钮时，响应由表单下脚本内的 JQuery 回调处理。

  • 有没有办法从 GWT 中访问这个回调？

  • 有没有办法覆盖 JQuery 发送操作？由于代码是 HTML 并且来自服务器，因此我无法将 ui-binder UiFields 放入其中以访问这些 DOM 元素。

  • 如果 GWT 可以访问提交的表单，我需要得到响应。

有没有办法用 JSNI 实现这一点？

4

2 回答 2

1

每个问题的答案：

1Is there a way to access this callback from within GWT?实际上你不能修改回调本身，你可以从GWT做的是调用任何jquery方法，因此你可以取消绑定任何以前添加的处理程序，并设置你的。

  //NOTE: not wrapping code in $entry() to make a clearer code.
  private static native unbindForm() /*-{

    // remove all jQuery handlers added previously to my form
    $wnd.$("my_form_selector").off();

    // add a new handler for the submit event
    $wnd.$("my_form_selector").on("submit", function(event) {
       event.preventDefault();
       $wnd.$(this).post(url, ...).done(function(data) {

         // Use JSNI to call a GWT method
         @.com.example.MyClass.handleFormResponse(*)(data);
         // NOTE: that you can use a star instead of having to write parameter
         // types, when you only have one method signature in your class.
       });
    } 
  }-*/

  // handle the form response in GWT
  public static void handleFormResponse(String data) {
    // handle form response in GWT
  }

您可以使用 GWT 做的另一件事是将您的内容包装form在 a 中FormPanel并使用特定的小部件方法来设置处理程序并读取响应。但我认为这不是你所要求的。

2Is there a way to overwrite the JQuery send action是的，使用JSNI要求 jQuery 取消绑定之前设置的事件。请参阅#1 中的代码。

3 I need to get the response if the submitted form accessible to GWT. 您必须在 jquery.post 回调中包含一些代码来调用 GWT 静态方法（您也可以使用非静态方法，但这种方式更容易）这也是JSNI。请参阅#1 中的代码。

4Is there a way how I can achieve this with JSNI?当然，JSNI 是与 GWT 中的手写 javascript 交互的方式。

附加说明：

  • GWT 旨在使用非常优化的 js 代码构建 RIA 应用程序。我知道每个人都有使用外部库的原因，但是将 3party javascript 添加到您的应用程序中违背了 gwt 编译器remove death code和optimize output. 如果您喜欢 jquery 之类的 GWT 语法和功能，我建议使用 gwtquery，它已完全用 gwt 编写，因此编译器将仅包含您使用的代码。

  • 编写 JSNI 是调试器中难以处理的错误的来源。所以我建议使用gwt-exporter来填充 java 方法/类或gwtquery来调用外部 javascript。请参阅我前段时间写的这些帖子：Pass value from GWT to Javascript via JSNI and Calling GWT Java function from JavaScript

于 2013-10-29T07:25:45.817 回答
0

Javascript => GWT 和 GWT => javascript 值都可以使用 JSNI 来完成。请在此处查看有关 JSNI 的更多信息

于 2013-10-25T07:52:47.407 回答