Implementieren zeigen/verbergen Funktionalität mit Javascript in Rails-Anwendung

Question

Eigentlich möchte ich Javascript-Code in meine Rails-Anwendung ausführen.

Ich habe eine neue Datei erstellt, die custom.js in "app/assets/javascripts" ist.

custom.js

$(document).ready(function() { 
    $("div#test").hide(); 
    $("a").click(function(event) { 
     event.preventDefault(); 
     $("div#test").fadeToggle(); 
    }); 
}); 

Ich habe auch, // = custom in application.js Datei benötigt aber immer noch der Code nicht gleich am Anfang verstecken.

application.js

// This is a manifest file that'll be compiled into application.js, which will include all the files 
// listed below. 
// 
// Any JavaScript/Coffee file within this directory, lib/assets/javascripts, vendor/assets/javascripts, 
// or any plugin's vendor/assets/javascripts directory can be referenced here using a relative path. 
// 
// It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the 
// compiled file. 
// 
// Read Sprockets README (https://github.com/rails/sprockets#sprockets-directives) for details 
// about supported directives. 
// 
//= require jquery 
//= require jquery_ujs 
//= require turbolinks 
//= require bootstrap-sprockets 
//= require nicetitle 
//= require custom 

index.html.erb

<a href="#" class="toggle-formed" style="float: right;" >Search</a> 

       <div id="sample" class="<%= @xvaziris_data.present? ? 'hidden' : '' %>"> 

        <%= form_tag xvaziris_path, method: 'get', class: "form-group", role: "search" do %> 
        <p> 
         <center><%= text_field_tag :search, params[:search], placeholder: "Search for.....", class: "form-control-search" %> 
          <%= submit_tag "Search", name: nil, class: "btn btn-md btn-primary" %></center> 
         </p> 
         <% end %><br> 

         <% if @xvaziris.empty? %> 

         <center><p><em>No results found for.</em></p></center>    

         <% end %> 

        </div> 

general.scss

.hidden { 
    display: none; 
} 

Die oben custom.js Code, wenn ich in index.html platzieren .erb unter JavaScript Script-Tag funktioniert es gut. Aber ich möchte mich nicht in jedem anderen Controller/Index wiederholen, da die Rails dem DRY-Prinzip folgen, das sich NICHT WIEDERHOLT.

Search.js

$(document).on('page:change', function() { 
     $("div#sample").hide(); 

    // | === HERE 
    $("a.toggle-formed").click(function(event) { 
     event.preventDefault(); 
     $("div#sample").fadeToggle(); 
    }); 
}); 

Irgendwelche Vorschläge sind herzlich willkommen.

Vielen Dank im Voraus.

Letzte Frage

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.

 Verwandte Themen

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.