[英]Rails/Javascript: Why do I get an error when I submit my form via javascript `submit()`?
我在视图中有一个搜索表单。
<%= form_with url: issues_path, class: 'filter-box' do %>
<%= text_field_tag(:filter_by, '', id: 'filter-text-field') %>
<% end %>
提交表单后,将运行以下操作:
class IssuesController < ApplicationController
...
def create
@labels = Label.by_search_term(params[:filter_by])
respond_to do |format|
format.js
end
end
end
一切顺利。
但是,我希望每次击键都能触发动作。 为此,我添加了以下javascript。
<script>
document.getElementById('filter-text-field').addEventListener('keyup', function(){
document.querySelector('.filter-box').submit()
})
</script>
但是当表单在key up上提交时它会中断并且我得到一个错误: ActionController::UnknownFormat in IssuesController#create
。
看着params,我没有看到任何值得注意的东西。
# Submitted by pressing return
# => <ActionController::Parameters {"utf8"=>"✓", "authenticity_token"=>"TJRajeBbEK8+D0Ly5/lbI/SVx8srhG/YS2W1l+Zc+f+TYmsbfehXnsluxOovblCrWBLJy0exhyzhsY+qPhBDOQ==", "filter_by"=>"d", "controller"=>"issues", "action"=>"create"} permitted: false>
# Submitted on keyup
# => <ActionController::Parameters {"utf8"=>"✓", "authenticity_token"=>"7NBwqCuJpbFGvxWgq6qqdB1hF0yptca0N446G4nQ620zJkE+tjrigLHek7hjPaH8seYZTMWALkCdWgAmUZxRqw==", "filter_by"=>"d", "controller"=>"issues", "action"=>"create"} permitted: false>
通过按Enter键提交表单并通过javascript提交表单有什么区别? 我需要做些什么来确保它正常工作?
Rails的form_with
帮助器将表单设置为remote: true
默认情况下为remote: true
。 因此,当您提交表单时,Rails的UJS会在中间执行并创建一个ajax请求。 当您在表单上使用submit()
方法时,它不允许Rails正确处理ajax请求,因为它不会触发Rails期望的事件。
您可以使用Rails的javascript对象帮助程序方法来触发提交而不是javascript的submit()
方法。 就像是:
document.getElementById('filter-text-field').addEventListener('keyup', function(){
Rails.fire(this.form, 'submit')
})
这将触发'submit'事件而不是提交表单,所以现在所有rails的回调都将处理rails的属性,如remote: true
, disable_with: ...
, confirm: ...
等。
编辑:添加引用: https : //github.com/rails/rails/tree/master/actionview/app/assets/javascripts/rails-ujs
start.coffee设置事件回调和utils / events.coffee定义fire
函数
EDIT2:这是Rails为表单的submit
事件添加所有回调的部分https://github.com/rails/rails/blob/master/actionview/app/assets/javascripts/rails-ujs/start.coffee#L55 -L62
这是使用Rails的帮助程序类来触发事件的函数https://github.com/rails/rails/blob/master/actionview/app/assets/javascripts/rails-ujs/utils/event.coffee#L34
我不确定是否有这方面的DOC,我已经学会了自己阅读代码,我不知道除了来源以外哪个地方指向你,对不起!
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.