导轨5上呈现JS要求

问题描述:

你好我试图呈现一个索引页特定部分来自同一指标控制器响应我是不知道有没有可能或不..导轨5上呈现JS要求

这是指数控制器代码

def index 
@songs = Song.language_fillter(params[:language]).category_fillter(params[:category]).paginate(:page =>params[:page], :per_page => 6) 
@languages = Song.distinct.select(:language) 
@category = Song.distinct.select(:category) 
respond_to do |format| 
    format.html{} 
    format.js{ render partial: 'songs/songshow', :collection => @songs, :layout => false} 
end 
end 

index.html.erb

<ul class="nav justify-content-center mt-3"> 
<li class="nav-item"> 
    <select class="custom-select song_filter" id="language_filter"> 
    <option value=""selected>Language</option> 
    <% @languages.each do |lang| %> 
    <option value="<%= lang.language %>"><%= lang.language %></option> 
    <% end %> 
</select> 
</li> 
<li class="nav-item"> 
    <select class="custom-select song_filter" id="category_filter"> 
    <option value="" selected>Category</option> 
    <% @category.each do |cat| %> 
    <option value="<%= cat.category %>"><%= cat.category %></option> 
    <% end %> 
    </select> 
</li> 
</ul> 
    <div class="container"> 
<div class="mt-5 row" id="songs_display"> 
    <%= render partial: 'songshow' %> 
</div> 

在这方面,我想换个CON与CoffeeScript的

$(document).on 'change', '.song_filter',() -> 
    language = $('#language_filter').val() 
    category = $('#category_filter').val() 
    console.log language+" "+category 
    $.ajax '/songs', 
    type:'GET' 
    data:{language: language,category: category } 
    dataType: 'text' 
    success: (data,textStatus,jqXHR) -> 
    $('#songs_display').html data 

这个我喜欢它的ID songs_display帐篷应该只渲染的部分,但它呈现布局还,但我想只有它应该呈现的部分。是有可能..

我重视形象这个问题:P enter image description here

嗨,我有一个想法要做到这一点。您正在使用respond_to博客。你可以创建一个文件咖啡一样控制操作名称,并把你的咖啡里呈现这样

index.js.coffee

$('#songs_display').html("<%= j render partial: 'songs/songshow', :collection => @songs %>"); 

变化指数动作的respond_to

format.js{} 

和你的js要求

$.ajax '/songs', 
    type:'get' 
    data:{language: language,category: category } 
    dataType: 'script' 

我希望这会对你有用。如果有任何问题,请让我知道。

+1

谢谢..它工作:) – ion