Schienen Ajax Refresh Teilweise während persistent Params

Question

Ich habe eine Rails App mit einem Controller/Ansicht namens "Anrufe". Hier ist die grundlegende Controller-Aktion für Index:

calls_controller.rb

def index 
    if params[:region].present? 
     @assigned = Call.where(region_id: params[:region][:area]).assigned_calls.until_end_of_day 
     @unassigned = Call.where(region_id: params[:region][:area]).unassigned_calls.until_end_of_day 
    else 
    @assigned = Call.assigned_calls.until_end_of_day 
    @unassigned = Call.unassigned_calls.until_end_of_day 
    end 
    end 

Hier sind meine Ansichten:

index.js.erb

$('#active').html("<%= escape_javascript render :partial => 'calls/assigned_calls', :locals => {:assigned_calls => @assigned} %>"); 
$('#inactive').html("<%= escape_javascript render :partial => 'calls/unassigned_calls', :locals => {:unassigned_calls => @unassigned} %>"); 

$(".select").select2({ 
     placeholder: "Select One", 
     allowClear: true 
    }); 

Index .html.erb

<div id="active"> 
    <%= render "assigned_calls" %> 
</div> 

<div id="inactive"> 
    <%= render "unassigned_calls" %> 
</div> 


<script> 
$(document).ready(function() { 
    setInterval(function() { 
      $.ajax('calls/<%= params[:region][:area] %>'); 
    } , 5000); 
}); 
</script> 

_assigned_calls.html.erb (Ansicht Code weggelassen)

<%= form_tag calls_path, :method => 'get' do %> 
    <p> 
<%= select_tag "region[area]", options_from_collection_for_select(Region.order(:area), :id, :area, selected: params[:region].try(:[], :area)), prompt: "Choose Region" %> 
<%= submit_tag "Select", :name => nil, :class => 'btn' %> 

Also, was passiert, ist auf Seite laden, wenn ich nicht über die params von: Region übergeben sie die Anrufe setzt ohne scoped werden nach Region. Wenn region_id vorhanden ist, werden Aufrufe ausgeführt, bei denen region_id "1" ist oder die Regions-ID, die vom submit_tag übergeben wird.

Das funktioniert gut in der Steuerung und Ansicht, aber hier ist mein Problem. Meine index.html.erb Ich muss die Teiltöne aktualisieren, OHNE die Params zu stören. Also auf SetInterval muss ich herausfinden, wie die Partials neu zu laden, während die Parameter in der URL beibehalten.

Ich habe versucht, dies herauszufinden mit einer setInterval-Methode, aber ich bin mir nicht sicher, was ich hier 100% tue.

Kann mir jemand einen Rat geben, wie die Teiltöne alle 5 Sekunden aktualisiert werden, während die Parameter beibehalten werden, damit meine Instanzvariablen durch die Aktualisierung bestehen bleiben?

Wenn Sie mehr Kontext und/oder Code benötigen, lassen Sie es mich bitte wissen.

Update Der Versuch, das Javascript basierend auf einer Antwort von einem Benutzer zu überarbeiten und hier ist, was ich habe.

calls?utf8=✓&region[area]=3:2901 Uncaught SyntaxError: Unexpected token) 

Vielleicht ist dies ein JS Syntaxfehler oder ich schließe nicht die Funktion richtig: Ich bekomme

<script> 
    $(document).ready(function() { 
    setInterval(function() { 
     $.ajax({ 
     url: 'calls_path', 
     type: "GET", 
     data: { "region": '<%= @region.html_safe %>' } 
     }), 5000); 
    }); 
    }); 
</script> 

Die Seite wird geladen, aber wenn es in dem Chrom-Inspektoren auszulösen versuchte.

Answer 1

Wenn ich richtig verstanden habe, möchten Sie Ihre Parameter irgendwie durch AJAX-Anruf an Ihren Controller, zurück zu Ihrer js.erb-Datei, wo es die Teilzahlen aktualisiert Pipeline?

Mein Rat ist übergebenen Parameter als Instanzvariablen in Ihrem Controller wie folgt festgelegt:

calls_controller. rb

def index 
    if params[:region].present? 
    @region = params[:region] 

    @assigned = Call.where(region_id: params[:region][:area]).assigned_calls.until_end_of_day 
    @unassigned = Call.where(region_id: params[:region][:area]).unassigned_calls.until_end_of_day 
    else 
    @assigned = Call.assigned_calls.until_end_of_day 
    @unassigned = Call.unassigned_calls.until_end_of_day 
    end 
end 

nun Ihre @region Instanz-Variable wird in Ihrem index.js.erb verfügbar sein, wo man es auf andere partials passieren können Sie zu machen versuchen.

index.js.erb

$('#active').html("<%= escape_javascript render :partial => 'calls/assigned_calls', :locals => { :assigned_calls => @assigned, :region => @region } %>"); 
$('#inactive').html("<%= escape_javascript render :partial => 'calls/unassigned_calls', :locals => { :unassigned_calls => @unassigned, :region => @region } %>"); 

_assigned_calls.html.erb

<%= form_tag calls_path, :method => 'get' do %> 
    <%= select_tag "region[area]", options_from_collection_for_select(Region.order(:area), :id, :area, selected: region.try(:[], :area)), prompt: "Choose Region" %> 
    <%= submit_tag "Select", :name => nil, :class => 'btn' %> 
<% end %> 

Außerdem glaube ich, dass eine bessere Praxis in Ihrem index.html.erb Skript-Tag es zu tun ist, wie dies:

<script> 
    $(document).ready(function() { 
    setInterval(function() { 
     $.ajax({ 
     url: 'calls_path', 
     type: "GET", 
     data: { "region": '<%= @region.html_safe %>' } 
     }); 
    }, 5000); 
    }); 
</script> 

Bitte testen Sie dies, wenn Sie interessiert sind und sich an mich wenden :)