Rails js-Dateien und Seite spezifische js

Auf Schienen legte ich alle JavaScript-Dateien in Anwendung js-Datei.Rails js-Dateien und Seite spezifische js

//= require jquery 
//= require jquery_ujs 
//= require dropzone 
//= require jquery.cookie 
//= require toastr 

//VENDOR JS BEGINS 
//= require pace/pace.min 
//= require modernizr.custom 
//= require jquery-ui/jquery-ui.min 
//= require boostrapv3/js/bootstrap.min 
//= require jquery/jquery-easy 
//= require jquery-unveil/jquery.unveil.min 
//= require jquery-bez/jquery.bez.min 
//= require jquery-ios-list/jquery.ioslist.min 
//= require jquery-actual/jquery.actual.min 
//= require jquery-scrollbar/jquery.scrollbar.min 
//= require bootstrap-select2/select2.min 
//= require switchery/js/switchery.min 
//= require imagesloaded/imagesloaded.pkgd.min 
//= require jquery-isotope/isotope.pkgd.min 
//= require classie/classie 
//= require codrops-stepsform/js/stepsForm 
//= require bootstrap-datepicker/js/bootstrap-datepicker

Dann rufe ich Javascript im Kopf von application.html.erb als;

Dann überprüfe ich die Geschwindigkeit der Website und ich werde vorgeschlagen, diesen JS-Aufruf an Körper zu nehmen. Ich weiß, ich sollte BTW. Aber das Problem ist mit dem seitenspezifischen JS-Code.

Stellen Sie sich vor Ich habe home.html.erb wo Benutzer Datum auswählen. Also habe ich Datapicker-Code in diese Seite eingefügt.

Wenn ich <%= javascript_include_tag 'application' %> in an der Unterseite des Körpers nehmen, dieses Mal, weil die jquery & picker noch nicht so speziell für diese Seite JS geladen gibt no method error

Was ist der beste Ansatz wäre?

Quelle

2016-12-20 Shalafister' s

Ich schätze, Sie verwenden keine Turbolinks? Wenn nicht, bedeutet das, dass Sie den gesamten HTML-Code (einschließlich der Assets) für jede Navigation laden. Wenn das der Fall ist, sollte Ihre erste Priorität sein, wie Sie alles nur einmal laden (wie mit Turbolinks oder Ajax-Apps wie eckig), wenn Sie die Leistung verbessern wollen. –

Vor schließen Tag Körper und kurz nach <%= javascript_include_tag 'application' %>

hinzufügen <%= yield :page_scripts %>

überall Dann ist (in der Regel nach oben) in einer bestimmten Ansicht, geben Sie Ihre Skripte mit:

<% content_for :page_scripts do %> 
    <script>alert("My nice scripts...");</script> 
<% end %>

Quelle

2016-12-20 20:58:14 Mat

Es ist eine sehr gute Beantworten Sie dies unter http://brandonhilkert.com/blog/page-specific-javascript-in-rails/.

Grundsätzlich möchten Sie Ihre App/views/layouts/application.html.erb öffnen und davon überzeugen, dass Sie jedes Mal, wenn eine Seite gerendert wird, Controller und Informationen anzeigen. Um dies zu tun von

Sie den Body-Tag ändern

<body> 
    <%= yield %> 
</body

<body class="<%= controller_name %> <%= action_name %>"> 
    <%= yield %> 
</body>

Also, wenn Schienen des Body-Tag macht es wird nun eine Klasse für den Controller und eine der Aktionen in der Steuerung hinzuzufügen.

Sagen Sie bitte einen Controller namens static_pages haben, und die static_pages Controller

def home 
end

hat Wenn Schienen rendert die Ansicht/Seite zu Hause, es jetzt zu dem Body-Tag eine Klasse von static_pages und eine Klasse hinzufügen, werden von hause.

<body class="static_pages home"> 
    the home view is rendered here 
</body>

Dies wird eine Website breite Veränderung, so dass, wenn Sie gehen auf einen Index Seite/Blick von dem Benutzer Controller des Body-Tag sein würden:

<body class="users index"> 
    the index view is rendered here 
</body>

Nun macht eine Datei mit dem Namen Verkäufer/assets/Javascripts/jquery-readyselector.js enthält:

(function ($) { 
    var ready = $.fn.ready; 
    $.fn.ready = function (fn) { 
    if (this.context === undefined) { 
     // The $().ready(fn) case. 
     ready(fn); 
    } else if (this.selector) { 
     ready($.proxy(function(){ 
     $(this.selector, this.context).each(fn); 
     }, this)); 
    } else { 
     ready($.proxy(function(){ 
     $(this).each(fn); 
     }, this)); 
    } 
    } 
})(jQuery);

Diese Datei richtig referenziert werden muss in der Anwendung.js

... 
//= require jquery 
//= require jquery_ujs 
//= require turbolinks 
//= require jquery-readyselector 
//= require_tree .

Sobald alles, was getan wird man es durch einen einfachen Alarm spezifisch für die Ansicht testen können Sie testen wollen, wie so:

// app/assets/javascripts/static_pages_home.js 

$(".static_pages.home").ready(function() { 
    return alert("You should only see this on the static pages home page."); 
}); 


// app/assets/javascripts/user_index.js 

$(".users.index").ready(function() { 
    return alert("You should only see this on the users index page."); 
});

Sie könnten auch einen Skript-Controller spezifischen machen, indem nicht Referenzierung die Aktion.

$(".users").ready(function() { 
    return alert("You should only see this on a users controller controlled page."); 
});

Quelle

2017-07-03 23:23:37 Jeremy

Sie können auch einen Blick auf Page-specific Javascript for Rails done right werfen. Das ist sehenswert!

Installation

Nach der Installation. Schauen wir uns den Beispielcode an.

Das bedeutet, wenn Sie die Bearbeitungsseite des Artikel-Controllers bearbeiten. Dann wird nur das Javascript ausgelöst. Dies wird bei anderen Controller-Aktionen nicht ausgelöst.

Quelle

2017-07-11 07:00:47 AnkurVyas

Ein Link zu einer Lösung ist willkommen, aber stellen Sie bitte sicher, dass Ihre Antwort ohne sie nützlich ist: [Fügen Sie einen Kontext um den Link hinzu] (// meta.stackexchange.com/a/8259), damit Ihre Mitbenutzer eine Idee haben, was es ist und warum es dort ist, zitieren Sie dann den relevantesten Teil der Seite, auf den Sie verlinken, falls die Zielseite nicht verfügbar ist. [Antworten, die etwas mehr als ein Link sind, können gelöscht werden.] (// stackoverflow.com/help/deleted-answers) – g00glen00b

Danke @ g00glen00b für Beratung! – AnkurVyas

Sieht besser aus, aber Sie können diese Antwort auf die Frage anpassen. Im Moment ist es ein Link + erklärt einen Beispielcode, aber beantwortet der Beispielcode die Frage? – g00glen00b

Rails js-Dateien und Seite spezifische js

Antwort

Verwandte Themen