Jquery Rails AJAX登录，无需Desive或authlogic

我使用RubyonRails4.2.0构建了一个站点。直播版可在以下网址获得：。在我的开发版本中，我有一个手工制作的登录系统，它可以完美地工作。我已经尝试将AJAX实现到侧栏中的登录链接中，我已经在工作了。但是，当我注销并单击“登录”链接时，表单会出现两次，有时是三次。如果我刷新浏览器窗口，窗体将只显示一次，这与预期的一样

有什么想法吗

提前谢谢

会话\u controller.rb：

    class SessionsController < ApplicationController
      def create
        if user = User.authenticate(params[:email], params[:password])
         session[:user_id] = user.id
         respond_to do |format|
           format.html { redirect_to root_path, :notice => "Logged in successfully" }
           format.js
         end      
       else
         respond_to do |format|
           format.html { flash.now[:alert] = "Invalid login/password combination" }
           format.js
         end

         render :action => 'new'
       end
     end

     def destroy
       reset_session
       respond_to do |format|
         format.html { redirect_to root_path, :notice => "You have successfully logged out." }
         format.js
       end
     end
   end

---

我认为这可能与会话控制器中的销毁操作或destroy.js.erb文件有关。

您指向的链接是获取会话控制器的新操作并将其附加到页面。您希望页面上的内容已经存在，然后使用Ajax提交表单

最好的方法是什么？

    <div id="login-form">
      <h1>Login</h1>

      <%= form_tag session_path do %>
        <div class="field">
          <%= label_tag :email %><br />
          <%= text_field_tag :email %>
        </div>
        <div class="field">
          <%= label_tag :password %><br />
          <%= password_field_tag :password %>
        </div>
        <div class="actions">
          <%= submit_tag 'Login' %>
        </div>
      <% end %>
    </div>

    $("<%= escape_javascript render(file: 'sessions/new.html.erb') %>").insertAfter('.login-link');

    $('#login-form').hide().slideDown();
    $('.login-link').hide();

    <div id="sidebar-wrapper">
      <ul class="sidebar-nav">
        <li class="toggle-menu">
          <a class="show-me menu-toggle" id="menu-toggle">
            <i class="fi-arrow-left" alt="Menu Toggle" style="text-align: right; width: 100%;"></i>
            <span class="fi-arrow-right" alt="Menu Toggle"></span>
          </a>
        </li>
        <li class="sidebar-brand">
          ALXS Design
        </li>
        <li>
          <%= link_to root_path do %>Home<span class="fi-home" alt="Home"></span><% end %>
        </li>
        <li>
          <%= link_to about_path do %>About<span class="foundicon-website" alt="About"></span><% end %>
        </li>
        <li>
          <%= link_to projects_path do %>Projects<span class="fi-folder" alt="Projects"></span><% end %>
        </li>
        <% if logged_in? %>
        <br />
        <li>
          <%= link_to new_article_path do %>New Article<span class="fi-add-doc" alt="New Article"></span><% end %>
        </li>
        <li>
          <%= link_to "Edit Password", edit_user_path(current_user) %>
        </li>
        <li>
          <%= link_to "Logout", logout_path %>
        </li>
        <% else %>
        <br />
        <li>
          <%= link_to "Login", login_path(@user, :format => :js), :remote => true, class: 'login-link' %>
        </li>
        <li>
          <%= link_to "Register", register_path %>
        </li>
        <% end %>
        <li>
          <div class="navigation-padding"></div>
        </li>
        <li class="hide-me">
          <a href="https://www.facebook.com/alxsdesign" target="_blank">Facebook<span class="fi fi-social-facebook"></span></a>
        </li>
        <li class="hide-me">
          <a href="https://github.com/tipsforthings" target="_blank">Github<span class="fi fi-social-github"></span></a>
        </li>
        <li class="hide-me">
          <a href="https://plus.google.com/u/0/116471654573031381012/posts/p/pub" target="_blank">Google+<span class="fi fi-social-google-plus"></span></a>
        </li>
        <li class="hide-me">
          <a href="https://twitter.com/alxsdesign" target="_blank">Twitter<span class="fi fi-social-twitter"></span></a>
        </li>

      </ul>
    </div>

    $('.login-link')[0].reset();