导出ajax / serverside数据表的最佳方法

时间:2016-06-28 05:36:15

标签: ruby-on-rails ajax ruby-on-rails-4 datatables

对于我的应用程序,我有一个使用ajax检索记录的数据表。数据表允许用户进行排序,搜索,并添加了一个额外的自定义字段,允许用户根据类别进行过滤。

现在,当我使用datatables提供的HTML5方法导出到CSV / Excel时,我只获取导出中浏览器中显示的记录。所以,我唯一的选择是进行服务器端导出。我有一个有效的导出功能,但我很难找到将我的过滤器传递给此导出函数的正确方法。

我不确定在我的模型中将参数输入到导出方法的最佳方法是什么。我想要包含jQuery来将参数添加到我的link_to,但是我不知道如何做到这一点,如果这被认为是良好的做法'。

我的代码:

<%= link_to "Download CSV", vendor_skus_path(format: "csv") %>

<%= select_tag "vendor-select", options_from_collection_for_select(@vendors, "id", "name"), include_blank: true, class:"vendor-select form-control" %>   

<table id="vendor-skus-table" class="table table-striped table-bordered table-hover" data-source="<%= vendor_skus_path(format: :json) %>">
  <thead>
    <tr>
      <th>Name</th>
      <th>Vendor</th>
      <th>Inventory Quantity</th>
    </tr>
  </thead>
  <tbody>
  </tbody>
</table>

$('#vendor-select.vendor-select').on('change', function() {
  $('#vendor-skus-table').DataTable().ajax.reload();
});

的CoffeeScript

$ ->
  $('#vendor-skus-table').DataTable
    processing: true
    serverSide: true
    retrieve: true
    pagingType: 'full_numbers'
    ajax: data: (d) ->
      d.sku = $('#vendor-skus-table').data('source')
      d.vendor_id = $('#vendor-select').val();
      return

数据表

class VendorSkuDatatable < AjaxDatatablesRails::Base
  def_delegators :@view, :params, :link_to, :vendor_skus_path, :vendor_path

  def sortable_columns
    @sortable_columns ||= ['VendorSku.name', 'Vendor.name', 'VendorSku.inventory_quantity' ]
  end

  def searchable_columns
    @searchable_columns ||= ['VendorSku.name', 'Vendor.name']
  end

  private

  def data
    records.map do |record|
      [
        link_to(record.name, record),
        link_to(record.vendor.name, record.vendor),
        record.inventory_quantity
      ]
    end
  end

  def get_raw_records
    # insert query here
    if params[:vendor_id].present?
      VendorSku.joins(:vendor).where(vendor_id: params[:vendor_id])
    else
      VendorSku.joins(:vendor).all
    end
  end
end

控制器操作

def index
  @vendor_skus = VendorSku.order(:name)
  @vendor_sku = VendorSku.new
  @vendors = Vendor.all

  respond_to do |format|
    format.html
    format.csv { send_data @vendor_skus.to_csv }
    format.json { render json: VendorSkuDatatable.new(view_context, { vendor_id: params[:vendor_id] }) }
    format.xls # { send_data @vendor_skus.to_csv(col_sep: "\t") } 
  end    
end

模型方法

def self.to_csv(options = {})
  CSV.generate(options) do |csv|
    csv << column_names
    all.each do |product|
      csv << product.attributes.values_at(*column_names)
    end
  end
end

1 个答案:

答案 0 :(得分:1)

如果您尚未致力于编写自定义服务器端导出的想法,则只需添加length menu即可。您提到当您使用导出按钮时,它仅导出可见行,但是您是否尝试过允许用户在导出之前更改可见行数?这似乎是一个更容易的解决方案,因为它听起来像你想要首先使用导出按钮。

$('#example').dataTable( {
    "lengthMenu": [ [10, 25, 50, -1], [10, 25, 50, "All"] ]
} );

上面的代码块将为要显示的记录数提供4个选项; 10,25,50和所有记录。您可以添加或删除所需的任何分页选项,但在我看来,如果您至少拥有每个数组的[-1]["All"]部分,则可以允许用户在导出之前显示所有记录将它们全部放在excel文件中。您甚至可以更改excel导出确认窗口,让用户知道在导出之前执行此操作。