我使用Rails UJS。 我有一个表格设置做一个远程提交,如下所示:
<form accept-charset="UTF-8" action="/subscriptions" class="new_subscription form-horizontal" id="new_subscription" data-remote="true" data-type="json" method="POST">
我试图找到一种方法,从JavaScript函数提交此表。 我试过了:
var form$ = $("#new_subscription");
form$.get(0).submit();
但这样做的问题是,它提交表单W / O远程,它发布到服务器,并刷新页面。 任何想法,这是为什么? 是否有不同的方式提交远程形式?
谢谢
也许对于那些使用jquery-ujs
(Rails的5.0默认及以下),如米哈伊尔作为已经回答,引发了自定义的jQuery事件将工作,即:
$("#new_subscription").trigger("submit.rails");
对于那些谁在2017年就这个问题迷迷糊糊地被使用Rails 5.1,答案是不同的。 Rails的5.1有所下降jquery
的依赖,因此已经取代了jquery-ujs
了一个完整的重写rails-ujs
。 请参阅: http://weblog.rubyonrails.org/2017/4/27/Rails-5-1-final/
因此,你必须触发适当的自定义事件对象在轨-UJS:
由于一时的,还有的文档(又名RailsGuides)在做的没有公布/推荐的方式,但这里有一些,你可以只是看Rails的源代码使用的选项:
使用Rails.fire
功能:
nativeFormEl = $("#new_subscription")[0] // you need the native DOM element Rails.fire(nativeFormEl, 'submit')
您还可以通过编程方式调用Rails.handleRemote
处理器(实际与提交表单一个data-remote=true
通过XHR:
nativeFormEl = $("#new_subscription")[0] // you need the native DOM element Rails.handleRemote.call(nativeFormEl, event); // unfortunately, you cannot reference the previously created submit CustomEvent object by rails-ujs.js // ... or ... Rails.handleRemote.call(nativeFormEl) // submits via XHR successfully, but throws an error after success callback at Rails.stopPropagation
我宁愿选择1,因为它只是使用了更多最新的Web API方法,即创建一个包装CustomEvent
,并分发到EventTarget
通过dispatchEvent
。
尝试触发submit.rails
事件:
$("#new_subscription").trigger("submit.rails");
尝试自己做一个Ajax请求:
$('#new_suscription').submit(function(){
/*do whatever you want here*/
$.post('/subscriptions',$(this).serialize(),function(){},'script');
}
这样一来,你做的表单数据的POST请求并执行响应为脚本。