2014-05-02 4 views
9
Es gibt eine Vorlage in meiner Rails-Anwendung, die den JavaScript-Code nicht beim ersten Mal ausführt, wenn er durch Klicken auf einen Link in meinem Haus geladen wird Seite. Es passiert nur, wenn es über den Link und nur beim ersten Mal aufgerufen wird. Ich weiß nicht, warum das passiert. Irgendeine Hilfe? Hier ist der Code.

Javascript wird nicht beim ersten Mal ausgeführt, wenn ich über einen Link auf eine Seite zugreife

Homepage:

#app/views/static_pages/home.html.erb 
#... 
<%= link_to "Nofify an absence", new_cancellation_path %> 

dies ist die Javascript-Datei:

//app/assets/javascripts/cancellations_new.js 

var validateDateTime = function(){ 
// some other code that returns true or false 
    } 
    $(document).ready(function(){ 
    $("#new_cancellation").submit(function(event){ 
     event.preventDefault(); 
     if (validateDateTime()) { 
     alert("Some alert"); 
     } 
     else { 
     // some more code 
     } 
    }); 
    }); 

Und die Vorlage, wo das Javascript ausgeführt werden soll:

#app/views/cancellations/new.erb 

<%= provide(:title, "Notify an absence")%> 
<div class="row"> 
<div class="span3 offset4"> 
    <h3> Notify an absence </h3> 

    <%= form_for @cancellation, :id => "new_cancellation" do |f| %> 
    <%= render 'shared/error_messages' %> 
    <% # some form elements...%> 
    <%= f.submit "Send", class: "btn btn-primary"%>   
    <% end %> 
</div> 
</div> 

Ich habe bereits versucht, das Hinzufügen //= require cancellations_new an die app/assets/javascripts/application.js ohne Verbesserung

EDIT

habe ich einige der Forschung, nach @radubogdan Blei und ich fand, dass Turbolinks für die „seltsame“ Verhalten von Javascript verantwortlich ist. Wenn in Ihrer Anwendung Turbolinks aktiviert sind, werden die Elemente <a> aus einer Ajax-Anforderung geladen, und dann wird der Inhalt verwendet, um die <body> Ihres HTML zu ändern. Da die Art und Weise wird das DOM geladen nicht die übliche ist, geschrieben der Code innerhalb von

$(document).ready(){...}

wird nicht funktionieren, es sei denn, die Seite vollständig (zum Beispiel das Aktualisieren des Browsers) neu geladen wird. Wenn Sie Ihr Javascript wollen wie gewohnt laufen, könnten Sie Ihre

$(document).ready(){...}

zu

$(document).on("page:change", function() { // some more code. });

Sie können einige weitere Informationen zu diesem Thema ändern finden here
more

+0

Haben Sie Turbolinks aktiviert? – radubogdan

+0

Ja, ich habe es. – felix

+0

Haben Sie versucht, es zu deaktivieren? Entfernen Sie es aus application.js und aus layout.html.erb, wo Sie das stylesshet Link-Tag verwenden. Wenn es ohne Turbolinks funktioniert, sollten Sie prüfen, wie man '$ (document) .on ('page: load', .....)' – radubogdan

Antwort

6

Ich denke, Turbolinks ist das Problem. Hast du versucht es zu deaktivieren?

Entfernen Sie es von application.js und layout.html.erb, wo Sie Stylesheet Link-Tag verwenden.

Wenn es ohne turbolinks funktioniert, dann sollten Sie Prüfung, wie

$(document).on('page:load', .....)

Dank verwenden

5

fügen Sie einfach in Ihrem application.html.erb

<body data-no-turbolink="true" > 
    # your content 
</body> 

ODER

fügen Sie diese zu Ihrer gem-Datei

gem 'jquery-turbolinks' 

BEIDE wie pro Ihre expection arbeiten.

Verwandte Themen