ruby on rails应用程序页面加载时的javascript问题
背景:我正在与可以创建wiki的用户一起创建wiki克隆。用户还可以添加作为其他用户的合作者,为Wiki做出贡献 当我点击一个链接进入那个页面时,我在javascript方面遇到了问题。当我重新加载同一个页面时,javascript可以工作。大多数javascript都支持自动完成搜索功能,该功能在页面底部呈现与搜索框中键入的字母匹配的用户名 在我的功能中,我在show#Wiki视图上有一个链接,链接到edit#Wiki视图,如下所示:ruby on rails应用程序页面加载时的javascript问题,javascript,ruby-on-rails,ruby,ajax,Javascript,Ruby On Rails,Ruby,Ajax,背景:我正在与可以创建wiki的用户一起创建wiki克隆。用户还可以添加作为其他用户的合作者,为Wiki做出贡献 当我点击一个链接进入那个页面时,我在javascript方面遇到了问题。当我重新加载同一个页面时,javascript可以工作。大多数javascript都支持自动完成搜索功能,该功能在页面底部呈现与搜索框中键入的字母匹配的用户名 在我的功能中,我在show#Wiki视图上有一个链接,链接到edit#Wiki视图,如下所示: #views/wikis/show.html.erb
#views/wikis/show.html.erb
<%= link_to "Edit", edit_wiki_path(@wiki), class: "btn btn-success" %>
下面列出了视图/collaborations/_new.html.erb
中的部分表单:
<%= form_for [wiki, collaboration] do |f|%>
<div class = "col-md-8">
<div class = "form-group">
<%= f.label :user_name %>
<%= f.text_field :user_name, class: 'form-control', placeholder: "Enter name" %>
</div>
<%= f.hidden_field :user_id %>
<div class = "form-group">
<%= f.submit class: 'btn btn-success' %>
</div>
</div>
<div id="user_data" class="dropdown">
<ul class="list-group" style= "width:50%">
<!-- <li class="list-group-item">Cras justo odio</li>
<li class="list-group-item">Dapibus ac facilisis in</li>
<li class="list-group-item">Morbi leo risus</li>
<li class="list-group-item">Porta ac consectetur ac</li>
<li class="list-group-item">Vestibulum at eros</li> -->
</ul>
</div>
</div>
</div>
</div>
<%end%>
最后,ajax调用的控制器操作是controllers/collaborations\u controller.rb中的collaboration\u search
:
class CollaborationsController < ApplicationController
respond_to :html, :js
def collaboration_search
#name_search = params[:collaboration][:user_name].to_s
@users_by_name = User.where('name Like ?', "%#{params[:collaboration]}%").limit(4)
puts @users_by_name.to_a
render json: @users_by_name
end
end
类协作控制器
我曾尝试移除turbolinks gem,但这并没有解决问题。我将感谢任何帮助 我不能100%确定为什么你的JS第一次就不工作了。可能有许多罪魁祸首,其中涡轮链接往往是一个很好的第一猜测。但我认为,通过尝试以下方法,您可以更接近于发现发生了什么:
- 抛出一个
console.log('in here')代码>在JS文件中,就在文档中。加载后,应将其打印到Web Inspector控制台。这将帮助您破译文件是否正在加载(但未正确运行)或根本没有加载
- 确保没有任何JS错误。这些将在Web检查器中显示为红色
- 您将JS和ERB结合的方式可能会导致一个错误或奇怪之处。
.js.erb
文件基本上是一个具有组合JavaScript功能的视图。您通常会将其保存在app/views
目录中,并告诉控制器如何处理它。在本例中,这看起来或多或少像一个常规的JS文件——在这种情况下,如何包含它是对其功能影响最大的问题。您是否将其包含在应用程序.js
文件中?在layout.html.erb
视图的
标记中?还有别的办法吗
关于此文件的ERB,值得指出的是,您似乎根本不需要ERB。如果说有什么不同的话,那就是你使用雇员再培训可能会把事情搞砸。我看到的唯一一条类似雇员再培训局的路线是:
<% @user = "data" %>;
;
该行接受Ruby/Rails变量@user
,并用字符串“data”覆盖它。这几乎肯定是你不想做的事情。(我不确定它是否会影响变量,因为您在这里使用它。)
tl;dr--我要重命名文件.js
,确保它包含在application.js
中,并在文件中添加一个控制台.log
,以确保它正在加载,这样您就可以隔离是加载问题还是JavaScript问题。另外,检查JS错误,并删除
行。希望以上内容能让你更清楚地了解到底发生了什么
class CollaborationsController < ApplicationController
respond_to :html, :js
def collaboration_search
#name_search = params[:collaboration][:user_name].to_s
@users_by_name = User.where('name Like ?', "%#{params[:collaboration]}%").limit(4)
puts @users_by_name.to_a
render json: @users_by_name
end
end
<% @user = "data" %>;