0

我正在编写一个 Rails 应用程序，并且我正在使用 jQueryMobile 作为移动视图。

大多数时候，我想让 JQM 像往常一样通过添加和删除“页面”来操作 DOM。但是，在某些情况下，我想覆盖默认行为，并自己执行一些简单的 DOM 操作。

例如，我有一个用户列表，每个用户都有一个“添加到联系人”链接/表单。

<ul data-role='listview'>

  <li>
    <span class='name' id="user_56757234">Jim</span>
    <form action="/contacts" class="new_contact_form" data-remote="true" data-type="json" id="new_contact_form_56757234" method="post">
      <!-- form info here -->
      <input name="commit" type="submit" value="Add Contact" />
    </form>
  </li>

  <li>
    <span class='name' id="user_975827294">Fred</span>
    <form action="/contacts" class="new_contact_form" data-remote="true" data-type="json" id="new_contact_form_975827294" method="post">
      <!-- form info here -->
      <input name="commit" type="submit" value="Add Contact" />
    </form>
  </li>

  <!-- etc... -->

</ul>

在用户点击添加给定联系人后，假设请求成功，给定的表单应该消失，表明该联系人已被添加。

我需要符合标准的 Rails RESTFUL 样式控制器，因此这些表单将提交给 ContactsController 创建操作，该操作将返回新联系人的 JSON 表示形式。

同样，我想阻止 JQM 尝试插入新页面——我只想删除触发事件的特定表单。但我不想禁用我在其他地方依赖的标准 JQM 行为。

有没有一种干净、简单的方法来做到这一点？

我收集 'pagebeforeload' 事件是我的朋友，但我不清楚如何设置它。

这篇文章似乎相关（jquery mobile 防止页面更改取决于调用页面）......但我是否正确，这是一个全局设置？就我而言，这似乎有点矫枉过正。

这是一个 Rails 3.1 项目，因此理想情况下我可以在特定于控制器的 javascript 资产文件中进行设置，以与标准 Rails-UJS 配合使用。

任何帮助将非常感激，

热情地，

4

2 回答 2

0

尝试data-ajax="false"作为表单标签中的属性。这将禁用 JQuery Mobile 的 ajax 行为并允许您在 Rails 中进行 ajax 调用。

于 2013-09-30T12:13:35.943 回答
0

像这样的东西：

$('#new_contacts').live('pageinit', function(event) {
  $('.new_contact_form_mobile').submit(function(e) {  
    var form = $(this);
    var formData = $(this).serialize();
    var request = $.ajax("/contacts", {
      type: "POST", 
      data: formData,
      dataType: "json"
    });

    request.done(function(msg) {
      form.fadeOut();
    });

    return false;
  });
 });
于 2012-04-20T20:11:37.357 回答