具有Javascript和Ajax的Rails開發環境

Question

在開發人員的后台進行某些工作我絕對不理解。

我有一個我在Mac上本地開發的應用程序，它的形式使Ajax稱為“ remote：true”。 它停止工作，沒有Ajax調用，日志中沒有任何內容。

我可以使它再次開始工作的唯一方法是通過添加第二個輸入字段（與原始文本相同，直接復制並粘貼）來編輯_form.html.erb部分。 刷新頁面，然后就可以了。 我沒有編輯我的原始編輯內容，因此代碼恢復到了原來的位置（當它不起作用時），但是現在可以正常工作了。

編輯會導致什么結果？ 有什么辦法可以使它發生而無需編輯代碼嗎？

謝謝。

-----編輯添加代碼-----

我的形式是（text_field_tag是我復制並粘貼的內容）

  <div id="friend-lookup">
  <h3>Search for friends</h3>
  <%= form_tag search_friends_path, remote: true, method: :get, id: 'friend-lookup-form' do %>
    <div class="form-group row no-padding text-center col-md-12">
      <div class="col-md-10">
        <%= text_field_tag :search_param, params[:search_param], 
                                    placeholder: "first name, last name or email", autofocus: true,
                                    class: 'form-control search-box input-lg' %>
      </div>
      <div class="col-md-2">
        <%= button_tag(type: :submit, class: "btn btn-lg btn-success") do %>
          <i class="fa fa-search"></i> Look up a friend
        <% end %>
      </div>
    </div> <!--- form-group -->
  <% end %>
  <%= render 'common/spinner' %>
  <% if @users %>
    <% if @users.size > 0 %>
      <div id="friend-lookup-results" class="well results-block col-md-10">
        <table class="search-results-table col-md-12">
          <tbody>
            <% @users.each do |user| %>
            <tr>
              <td><strong>Name:</strong> <%= user.full_name %></td>
              <td><strong>Email:</strong> <%= user.email %></td>
              <td><strong>Profile:</strong> <%= link_to "View Profile", user_path(user),
                                                        class: "btn btn-xs btn-success" %>
                <% if current_user.not_friends_with?(user.id) %>
                  <%= link_to "Add as my friend", add_friend_path(user: current_user, friend: user),
                                                    class: "btn btn-xs btn-success", method: :post %>
                <% else %>
                  <span class="label label-primary">
                    You are friends
                  </span>
                <% end %>
              </td>
            </tr>
            <% end %>
          </tbody>
        </table>
      </div>
    <% else %>
      <p class="lead col-md-12">
        No people match this search criteria
      </p>
    <% end %>
  <% end %>
  <div id="friend-lookup-errors"></div>
</div>

而JavaScript是

# assets/javascript/friends.js

var init_friend_lookup;

init_friend_lookup = function() {
  $('#friend-lookup-form').on('ajax:before', function(event, data, status){
    $('#friend-lookup-results').replaceWith(' ');
    show_spinner();
  });

  $('#friend-lookup-form').on('ajax:after', function(event, data, status){
    hide_spinner();
  });

  $('#friend-lookup-form').on('ajax:success', function(event, data,status){
    $('#friend-lookup').replaceWith(data);
    init_friend_lookup();
  });

  $('#friend-lookup-form').on('ajax:error', function(event, xhr, status, error){
    hide_spinner();
    $('#friend-lookup-results').replaceWith(' ');
    $('#friend-lookup-errors').replaceWith('Person was not found.');
  });
}

$(document).ready(function() {
  init_friend_lookup();
});

Answer 1

您可能習慣於安裝JavaScript行為以響應window.onload，DOMContentLoaded或jQuery ready事件。 使用Turbolinks，這些事件僅在響應初始頁面加載時才會觸發，而不是在隨后的任何頁面更改之后觸發。

更改“ turbolinks：load”的“就緒”事件，並對所有事件重復相同的步驟。

$(document).on('turbolinks:load', function () {
    init_friend_lookup();
});

閱讀文檔https://github.com/turbolinks/turbolinks

Answer 2

也許這會幫助某個人。

我正在運行Rails 5。

棘手的是，它似乎是斷斷續續的。

我的問題似乎與turbolinks有關。 刪除javascript / application.js中的 turbolinks

// =需要turbolinks

似乎已經一致地解決了這個問題。