Question

我的问题非常特别，因为它非常具体。我的rails app有sidebar用作不同网页之间的导航，每当我使用nav links内生成的sidebar加载网页时，加载的网页都非常特殊{ {1}}。

例如，我的javascript调用仅部分工作，因为ajax会保存数据，但未调用关联的controller，因此不会打印保存消息。< / p>

最奇怪的是，如果通过直接在导航栏中输入地址或者重新加载页面来加载相同的页面，一切正常，所以问题似乎是ajax:success <生成的导航链接/ p>

一些代码来说明。

_side_navbar.html.erb

link_to()

application_helper.rb

<%= nav_link("", edit_company_path(@company)) %>
<%= nav_link("", edit_fiscal_path(@company.fiscal))%>
<%= nav_link("", controller: 'socials', action: 'edit')%>

edit.html.erb

def nav_link(text, link) #allows me to apply .active bootstrap class to current link in the sidebar
 class_name = current_page?(link) ? "list-group-item-info" : nil
 link_to text, link, class: "list-group-item #{class_name}"
end

companies_controller.rb

<%= form_for(@company, {remote: true, html: {class: "update-form"}}) do |company_form| %> #ajax form
...
<%= submit_tag('Submit', class: 'btn btn-primary') %>

utils.coffee

def update
 if (@company.update(company_params))
  render json: AJAX_SUCCESS_MESSAGE.to_json, status: 200 #works as the object is succesfully updated in the db.
 else
  response = {message: @company.errors.full_messages, models: @company.errors.keys}
  render json: response, status: 422
 end
end

如上所述，由于浏览器控制台中没有打印任何消息，因此显然会被调用的$ -> $('.update-form').on 'ajax:success', (event, data, status, xhr) -> console.log "here" #does not get printed to the browser console #successDiv = createDiv("alert-success") #successDiv.append xhr.responseJSON $('.update-form').on 'ajax:error', (event, xhr, status, error) -> console.log "here" #doesn't work either #errorDiv = createDiv("alert-danger") #$.each xhr.responseJSON.message, (index, value)-> #errorDiv.append value + '. ' #addDivContext(xhr.responseJSON.models)旁边的evrything运行良好。我真的不知道如何调试它，所以感谢任何可以提供帮助的人。

Answer 1

submit_tag不应该是company_form.submit吗？

对于Turbolinks，请尝试更换$ - ＆gt;与$（document）.on'就绪页面：更改'， - ＆gt;绑定Turbolink重定向。

Answer 2

我认为当dom准备就绪时，.update-form不存在，或者你正在使用turbolinks，在这种情况下你的js-code不再被执行。

简单的解决方法可能是这样的

$ -> 
  $(document).on 'ajax:success', '.update-form', (event, data, status, xhr) ->
    console.log "received!"

如果您使用turbolinks，最简洁的方法是使用

$(document).on 'ready page:load', -> 
  $('.update-form').on 'ajax:success', (event, data, status, xhr) ->
    console.log "here"

而不是简单的$ ->

Answer 3

companies_controller.rb

def update
  respond_to do |format|
   if (@company.update(company_params))
    format.js
   else
    response = {message: @company.errors.full_messages, models: @company.errors.keys}
    format.json {render json: response, status: 422}
   end
 end
end

在update.js.erb所在的同一文件夹中添加edit.html.erb

console.log("Update.js.erb file Updated");

$('nav').after("<div class='alert alert-success'> Successfully Updated </div>");

edit.html.erb

<%= form_for(@company, {remote: true, html: {class: "update-form"}}) do |company_form| %> #ajax form
...
<%= submit_tag('Submit', class: 'btn btn-primary') %>

从link_to（）加载页面时javascript无法正常工作

3 个答案: