使用自定义ajax搜索的结果更新ajax-datatables-rails表

时间:2015-07-17 07:39:08

标签: ruby-on-rails datatables

我有一个简单的dataTables解决方案,使用ajax-datatables-rails gem。它工作得很好,但我现在正在尝试实现一个解决方案,我可以在其中更新现有的dataTable,其结果来自一个单独的操作,从自定义搜索表单调用。现有代码,其中控制器动作:

...
respond_to do |format|
   format.html
   ormat.json { render json: CasefileDatatable.new(view_context, {:user_id => current_user.id}) }
end

(*目前没有使用user_id,只是测试从控制器传入... Datatable类)

使用CasefileDatable:

def data
    records.map do |record|
      [
          record.county.county_name,
          record.date.strftime("%m/%d/%y"),
          record.case_number,
          record.primary_property_address,
          record.table_json.to_s
      ]
    end
end    

...

def get_raw_records
    Casefile.all
end

*最后一栏,记录了record.table_json.to_s;包含我在后续处理中需要的内容

使用Javascript:

var casefileTable = $('#casefiles-table').DataTable({
        "processing": true,
        "serverSide": true,
        "ajax": $('#casefiles-table').data('source'),
        "stateSave": false,
        "pagingType": 'full_numbers',
        columns: [
            {data: '0'},
            {data: '1'},
            {data: '2'},
            {data: '3'}
        ]
});

这一切都很棒。然后我开始添加一个自定义搜索表单,因为这个模型更广泛,需要能够搜索可选属性,跨多个模型使用连接等。所以,我有另一个操作从表单中记录这个ajax请求,然后在第一次尝试时使用jbuilder返回json。我的策略是使用dataTable api直接操作现有的dataTable,并在我的表单中添加了相关的js调用... ajax:success handler,如下所示:

//this seems to trigger a reset/refresh, so I arrive where I started
$('#casefiles-table').dataTable().fnClearTable();
$('#casefiles-table').dataTable().fnAddData(data);

然后是这些dataTable调用,它什么也没做:

...
var dt = $('#casefiles-table').DataTable();
dt.clear().draw();
dt.rows.add(data);
dt.draw();
...

然后我想到也许我可以返回一个不同的...... Datatable类,并在我的控制器中执行所有AR查询,然后传入ActiveRecord_Relation对象,然后在新的CasefileSearchDatatableClass中使用它,像这样:

控制器动作返回:

...
  render json: CasefileSearchDatatable.new(view_context, {:query => finder})
end

然后在CasefileSearchDatatable类中get_raw_records:

def get_raw_records
    results = options[:query]
    # following line was just to test passing in the query via options
    # p "search raw records results: #{results.size}"
    results
end

这种作品; sql日志和我的p语句证明了查询被触发,但是数据表没有用结果更新,也没有被清除;保持完全不变。

所以,我正在尝试使用上述方法中的任何一种来获得更新此表的最佳方法,或者在必要时使用完全不同的方法。此外,假设第一个目标是可能的,不知道如何最好地处理分页。谢谢你的任何指示。

1 个答案:

答案 0 :(得分:3)

此JavaScript代码应该有效(除了一个额外的draw()),不知道它为什么没有:

var dt = $('#casefiles-table').DataTable();
dt.clear();
dt.rows.add(data);
dt.draw();

我不认为您使用单独的Ajax调用的方法会起作用,因为您具有启用了服务器端处理的Ajax源数据("serverSide": true)。因此,在添加自定义筛选数据后,任何后续用户操作(排序,下一页/上一页)都将调用$('#casefiles-table').data('source')指定的URL,并将重置自定义筛选数据。

<强>解

使用自定义过滤控件,建议使用ajax.data属性将自定义变量发送到服务器端脚本。例如:

$('#casefiles-table').DataTable({
  "ajax": {
    "url":  $('#casefiles-table').data('source'),
    "data": function ( d ) {
        d.extra_search = $('#extra').val();
    }
  }
});

然后在服务器端检索这些自定义变量的值(例如params.extra_search)并相应地调整您的查询。