每頁顯示的項目將與分頁

Question

我已經使用的rails會分頁gem分頁。我有一個下拉，它允許用戶選擇每頁的項目數。我希望我的分頁能夠在每頁顯示很多項目。

爲此，我從查看文件中調用jquery，並在select標籤上進行更改操作。

查看代碼：

%table.treeTable 
%tbody 
    - Ic.make_tree(@ics).values.each do |root| 
     %tr{:id => root.tree_id, :class => "root"} 
     %td= root.root_name 
     - if show_check_boxes 
      %td= check_box_tag "ic_glob", root.tree_id, false, :class => "ic_parent" 
     - root.suites.each do |suite| 
     %tr{:id => suite.tree_id, :class => "child-of-#{root.tree_id}"} 
      %td= suite.suite_name 
      - if show_check_boxes 
      %td= check_box_tag "ic_glob", suite.tree_id, false, :class => "ic_parent" 
     - suite.children.each do |case_item| 
      %tr{:id => case_item.tree_id, :class => "child-of-#{suite.tree_id}"} 
      %td= case_item.case_name 
      - if show_check_boxes 
       %td= check_box_tag "ic_glob", case_item.tree_id, false, :class => "ic_parent" 
      - case_item.children.each do |ic| 
      %tr{:id => ic.id, :class => "child-of-#{case_item.tree_id}"} 
       %td= link_to ic.name, edit_ic_path(ic.id) 
       - if show_check_boxes 
       %td= check_box_tag "ic_ids[]", ic.id, false 
    =will_paginate @ics 

Ajax代碼：

$('.ics_per_page').live('change',function(){ 
$.ajaxSetup({beforeSend: function(xhr) {xhr.setRequestHeader("X-CSRF-Token", $("meta[name='csrf-token']").attr("content")); }}); 
    value1=($(this).val()); 
    $.post('/ics/index', {ics_per_page:value1}); 
    return false; 
    }) 

從阿賈克斯我打電話索引控制器。控制器進入控制器內部，但重新加載沒有發生。

控制器代碼：

def index 
    ics_per_page=params[:ics_per_page]||5 
    ics_per_page=ics_per_page.to_i 
    @ics = Ic.search(params[:root_name],params[:suite_name],params[:case_name],params[:name],'f').paginate(:per_page =>ics_per_page, :page => params[:all_ics]) 
    respond_to do |format| 
     puts "inside index" 
     format.html # index.html.erb 
     format.xml { render :xml => @ics } 
    end 
    end 

請幫我在這裏。

謝謝， Ramya。

Answer 1

好的，所以基本上：XHR請求 - >控制器 - >動作 - >呈現視圖作爲返回值。

你需要打電話給你的控制器。這是你已經做的。

其次，控制器檢索到的數據應該用於更新當前頁面。對於這一點，我會延長你的respond_to：

就是說JS請求將渲染index.js {ERB，RJS，...}處理程序。在這裏，你編寫你的代碼來更新視圖。呈現的輸出是您將在JavaScript中作爲返回值接收的內容。

最後，您需要評估響應。

提示：您正在通過javascript調用您的索引操作。你應該用GET而不用POST來做到這一點。

Answer 2

Ajax請求不會重新加載頁面。在頁面中有一個不可見的表單，並在後臺更改值。

在頁面中有一個不可見的表單。

<form action="/ics" method="get" style="display:none" id="change_number_of_ics"> 
    <input type="hidden" name="ics_per_page" id="num_of_items" value="" /> 
</form> 

寫一個jQuery回調像

$('.ics_per_page').live('change',function(){ 
    value1= $(this).val(); 
    $("#num_of_items").attr("value", value1); 
    $("form#change_number_of_ics").submit(); 
});