如何通过url params动态设置Datatables搜索和列过滤器状态?

Dar*_*rme 2 ruby-on-rails datatables ruby-on-rails-3

假设我有两种模式:客户订单.每个订单都属于客户.

我还设置了一个订单(索引)视图,其中Datatable显示了所有订单.如果我想查看给定客户的所有订单,我所要做的就是过滤该客户在"搜索"字段中编写相关客户名称或从其列过滤器字段中选择该客户的结果.

现在,我想实现一个客户订单链接,该链接会自动显示带有这些设置的数据表订单.

换句话说,我希望链接到/ orders?isearch ='customer_name + customer_surname'将显示已在搜索字段中写入客户全名的数据表(或相应的客户列过滤器集).

当然,我可以取@customer从控制器实例变量并将其传递给视图,但然后

Dar*_*rme 5

使用初始化代码中的oSearch变量,我可以为搜索字段定义一个初始化值,即isearch变量:

$(document).ready( function() {

  var isearch = $('#isearch').val()   

  $('#example').dataTable( {
    "oSearch": {"sSearch": isearch}
  } );
} ) 
Run Code Online (Sandbox Code Playgroud)

isearch值存储在视图中的适当隐藏字段中:

 <%= hidden_field_tag "isearch", @isearch.to_s, { :id => "isearch" } %>  
Run Code Online (Sandbox Code Playgroud)

(这是我到目前为止将实例变量传递给Rails中的.js文件的最佳方法).

最后但并非最不重要的是,@ orderarch实例变量是从order_controller设置的:

@isearch = params[:isearch]  
Run Code Online (Sandbox Code Playgroud)

当然它的值应该传递给url,如:

.../orders?isearch='customer_name+customer_surname'
Run Code Online (Sandbox Code Playgroud)

- - 附录 - -

我发现我不需要实例变量,实际上我可以使用这个javascript函数传递尽可能多的url params:

function getUrlParam( name )
{
  name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
  var regexS = "[\\?&]"+name+"=([^&#]*)";
  var regex = new RegExp( regexS );
  var results = regex.exec( window.location.href );
  if( results == null )
    return "";
  else
    return results[1].replace("+", " ");
Run Code Online (Sandbox Code Playgroud)

}

然后我可以从我的.js文件中获取它们,如下所示:

// fetches url params
var isearch = getUrlParam('isearch');
var customer_name = getUrlParam('customer_name');
var order_status = getUrlParam('order_status');
Run Code Online (Sandbox Code Playgroud)

根据这些值,我不仅可以设置oSearch变量,还可以使用Datatables aoSearchCols初始化参数(http://www.datatables.net/ref#aoSearchCols)设置特定于列的列.

最后要解决的问题,因为我使用了带有select元素的单独列过滤(http://www.datatables.net/release-datatables/examples/api/multi_filter_select.html),所以根据URL设置每个select元素 - 通过参数.我用这个jQuery指令做到了:

// sets all select filters according to url passed params
$('select').val([customer_name, preparation_kind, preparation_status]);
Run Code Online (Sandbox Code Playgroud)

从性能的角度来看,这个解决方案是可以改进的,但它很容易且有效.