我正在编写一个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样式控制器,所以这些表单将提交给JSON操作,该操作将返回新联系人的ContactsController表示。
同样,我想阻止JQM尝试插入新页面--我只想删除触发事件的特定表单。但我不想禁用我在其他地方依赖的标准JQM行为。
有没有一种干净、简单的方法来做到这一点?
我想'pagebeforeload‘事件是我的朋友,但我不清楚如何设置它。
这篇文章似乎是相关的( jquery mobile prevent page change depending on calling page ) ...but,这是一个全球设置,我说的对吗?在我的情况下看起来有点过分了。
这是一个Rails 3.1项目,所以理想情况下,我可以在特定于控制器的javascript资源文件中设置它,以一种与标准Rails-UJS配合良好的方式。
任何帮助都将不胜感激,
热情的,
发布于 2012-04-20 20:11:37
如下所示:
$('#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;
});
});
发布于 2013-09-30 12:13:36
尝试将data-ajax="false"
作为表单标记中的属性。这将禁用JQuery Mobile的ajax行为,并允许您在Rails中进行ajax调用。
https://stackoverflow.com/questions/10238899
复制