Rails 5 Führen Sie Javascript beim Laden der Seite nach dem Absenden des Formulars

Question

Dies sollte eine gemeinsame Antwort sein, aber ich habe gesucht und kann es nicht finden. Ich habe eine <div class"xyz" style= "display:none" erstellt, die eine partielle beherbergt. Das Formular, das ich einreiche, ist eine Abrufanfrage für den Index des Controllers meiner Ansicht. Ich habe kein Problem Javascript bei der Formularübergabe laufen zu lassen, aber ich möchte ein wenig Javascript nach dem Laden der Seite ausführen, damit ich mein div einblenden kann. Beachten Sie, dass dies keine entfernte Ajax-Form ist.

index.html.erb: Hier ist der div, die versteckt ist, dass ich nach der Seite neu geladen sichtbar machen will:

<div class="six wide column" > 
    <div id="clients_piece_tab_container" style="display: none;"> 
    <%= render :partial => 'client_piece_tab'%> 
    </div> 
</div> 

index.html.erb Meine Form auf dem Index trägt mit einem form_tag

<%= form_tag('clients', action: :index, method: :get) do%> 
    <%= render :partial => 'update_available'%> # <--Not the div/partial Im trying to unhide. 
    <br/> 
    <div class="four wide column"> <%=submit_tag "Get Clients", class: "ui primary button"%></div> 
<%end%> 

Was ich denke ich weiß ist, dass ich in der Lage sein sollte, index.js.coffee auszulösen, nachdem die get-Anfrage abgeschlossen ist. Aber ich habe versucht, die folgenden mit Fehlern etwa 0 Argumente von 1:

clients_controller.rb

respond_to do |format| 
    format.js {} 
end 

Answer 1

In Rails nur mit Blick normal reagieren.

Innerhalb dieser Ansicht setzen diese irgendwo:

<script> 
    // rails should fill in form_submitted to true or false... 
    var form_was_submitted = <% form_submitted %>; 
    // idiomatic jquery for running on page load 
    $(function() { 
     if (form_was_submitted) { 
      console.log ('this runs on page load'); 
     } 
    }); 
</script> 

Wenn Sie ohne jquery tun wollen, dann see this SO answer

Eine andere Möglichkeit, es zu tun könnte AJAX zu verwenden sein:

<script> 
    $('#clients').on ('submit', function (event) { 
     // this runs when the user submits the form 

     // prevents the form from actually reloading the page 
     event.preventDefault(); 

     // ajax requests are async 
     $.ajax ({ 
      url: '/path/to/index', 
      method: 'GET', 
      data: { something: 'something' } 
     }).success (function (server_response) { 
      // this function runs after the ajax request completes 
      console.log ('server responded with ', server_response); 
      // show the div 
      $('#clients_piece_tab_container').show(); 
     }); 
    }); 
</script>