2016-04-29 15 views
2

Ich versuche, nicht eingeloggte Benutzer direkt zu einem Anmeldefenster umzuleiten, das ein modales Bootstrap-Fenster ist.Rails: Redirect mit Aufruf an Ajax

Ich schrieb eine Methode logged_in_user in ApplicationController genannt:

def logged_in_user 
    unless !current_user.nil? 
    flash[:danger] = "Please log in" 
    redirect_to root_url 
    end 
end 

Die login_url Routen sessions#new, die ich wie unten definiert:

(sessions_controller.rb) 

def new 
    respond_to do |format| 
    format.html 
    format.js 
    end 
end 

Hier ist der Ansicht ist, dass redirect_to root_url Punkte:

<!-- Login Window --> 
    <div id="login-window" class="modal fade" role="dialog" aria-labelledby="login" aria-hidden="true"></div> 

Hier ist new.js.erb, die ausgeführt wird, wenn sessions#new genannt wird:

$("#login-window").html("<%= escape_javascript(render 'sessions/new') %>"); 

So ist das Login-Formular, das _new.html.erb in app/views/sessions ist, wird als ein Popup-Fenster angezeigt, sobald die sessions#new genannt wird.

Außer, dass es als JS statt HTML verarbeitet werden muss. So habe ich den folgenden Link, das in allen Ansichten in den _header.html.erb und verfügbar ist, um sicherzustellen, dass dies der Fall ist:

<%= link_to "Log in", login_path, {remote: true, 'data-toggle' => "modal", 'data-target' => '#login-window'} %> 

Dies funktioniert gut, wenn der Link angeklickt wird. Aus diesem Grund entschied ich mich für redirect_to root_url anstelle von redirect_to login_url in logged_in_user Methode, da der letztgenannte Ansatz in "Fehlender Template-Fehler" resultiert.

Aber was ich wirklich will ist, dass Benutzer direkt zum Popup-Fenster umgeleitet werden, anstatt dass sie zuerst zu root_url weitergeleitet werden und auf "Login" klicken müssen, um das Formular einzugeben. Mit anderen Worten, ich brauche eine Möglichkeit, Benutzer irgendwie auf die sessions#new umleiten, indem Sie eine Ajax-Anfrage, so dass sessions#new kann als JS verarbeitet werden.

ich folgende Ansätze für die gewünschte Umleitung innerhalb logged_in_user Methode versucht, von denen keines gearbeitet:

render js: "window.location = <%= escape_javascript(render 'sessions/new') %>" 

render js: "window.location = '/sessions/new'" 

redirect_to login_url, format: "js" 

werden Anregungen sehr dankbar!

Antwort

1

Gerade diese

<script type="text/javascript"> 
    $(document).ready(function() { 

    if(window.location.href.indexOf('#login-window') != -1) { 
    $('#login-window').modal('show'); 
    } 

}); 

</script> 

Und

hinzufügen
redirect_to root_url+"#login-window" 
+0

Vielen Dank für Ihre Antwort. Es war knapp! Obwohl der gewünschte visuelle Effekt (dh Fade) durch Ihren Code erreicht wurde, erschien das Formular selbst nicht. – Taiga

+0

what point load session/new von '$ (" # login-window "). Html (" <% = escape_javascript (render 'sessions/new')%> ");'? Verwenden Sie Ajax, wenn Daten dynamisch sind. Sie "Sitzungen/neu" ist dynamisch HTML? Ich denke nicht. Laden Sie einfach in html.erb durch Rendern. Formular muss erscheinen, wenn es Modal Bootstrap und keine js Fehler ist. – cruncher

+0

Nun, es ist nur für Benutzer "cliking" den Link namens "Anmelden". Wie auch immer, das Problem wurde durch Ihren Vorschlag gelöst. Ich werde die Antwort selbst veröffentlichen. Vielen Dank für Ihren aufschlussreichen Rat! – Taiga

1

Dieses Problem wird durch Modifizieren der folgenden Dateien gelöst wurde:


(application_controller.rb)

def logged_in_user 
    unless !current_user.nil? 
    session[:modal] = true 
    redirect_to !request.referrer.nil? ? (request.referer + "#login-window") : "#login-window" 
    end 
end 

Ich habe flash[:danger] weggelassen, weil es "hinter" dem ausgeblichenen Bildschirm angezeigt wurde. Ich habe request.referer hinzugefügt, um sicherzustellen, dass das Login-Popup-Fenster dort angezeigt wird, wo der Benutzer eine Anfrage gestellt hat, anstatt sie zu root_path umzuleiten.Ich dachte, dies wäre besser für die Benutzererfahrung. (Das Ternär sollte nur den Fall behandeln, in dem request.referernil sein kann, in welchem ​​Fall der Code einen Fehler verursacht.) Das Motiv hinter session[:modal] = true wird unten erklärt.


(am unteren Rand des application.html.erb)

<% if session[:modal] == true %> 
    <script type="text/javascript"> 
    $(document).ready(function() { 
     if(window.location.href.indexOf('#login-window') != -1) { 
     $('#login-window').modal('show'); 
     $("#login-window").html("<%= escape_javascript(render 'sessions/new') %>"); 
     } 
    }); 
    </script> 
    <% session[:modal] = false %> 
<% end %> 

Hier bin ich mit Javascript direkt in der Ansicht Vorlage. Da die Ansichtsvorlage, auf der das Popup-Fenster erscheint, nicht auf eine bestimmte Vorlage beschränkt ist, habe ich das Skript innerhalb von application.html.erb, das für alle Ansichtsvorlagen gilt. Die erste Hälfte wurde von der cruncher Antwort inspiriert. (Danke Cruncher!) Ich habe dann $("#login-window").html("<%= escape_javascript(render 'sessions/new') %>"); hinzugefügt, um sicherzustellen, dass das Login-Formular ("app/views/sessions/_new.html.erb") erscheint.

Nun, da ich mag das Fenster Login Popup nur angezeigt werden, wenn nicht-angemeldeten Benutzer versuchen, Seiten zuzugreifen, die eine Anmeldung erfordern, ging ich weiter und fügte hinzu session[:modal] = true um anzuzeigen, dass logged_in_user Methode in der Tat genannt wurde, was bedeutet, dass die die obige Situation ist tatsächlich aufgetreten.

Dann kann ich in application.html.erb überprüfen, ob das Popup-Fenster von <% if session[:modal] == true %> angezeigt werden soll. Wenn das der Fall ist, wird das Skript ausgeführt, und danach setze ich den Wert session[:modal] auf false.

Diese session[:modal] Logik kann nicht notwendig sein (in der Tat, es funktionierte ohne es gut), aber ich habe es nur für den Fall hinzugefügt.


Das ist es :)

Auch für diejenigen von Ihnen, die dieses Pop-up-Fenster-Funktionalität mit Bootstrap implementieren möchten, hier ist ein Blog ich wirklich nützlich gefunden habe:

https://coderwall.com/p/ej0mhg/open-a-rails-form-with-twitter-bootstrap-modals

Glückliche Codierung!

+0

So zeigt das Modal nur, wenn Seiten/Links, die Benutzer angemeldet sein müssen, geöffnet sind? –

+0

In meiner Anwendung wird es auch geöffnet, wenn ein Benutzer auf einen Link "Anmelden" in der Kopfzeile klickt. – Taiga

+0

Was passiert, wenn das Java-Skript in ihrem Browser nicht aktiviert ist? –