Question

我希望能够链接到具有数据表的页面，该数据表将在URL中传递搜索参数值。目标是使用搜索值参数预先过滤数据表打开的页面。

我已经设置了一个jsfiddle来处理一些样本数据 http://jsfiddle.net/lbriquet/9CxYT/10/

这个想法是在jsfiddle url中添加一个参数，以便显示页面，搜索输入值设置为“firefox”，并且表格被过滤以仅显示搜索匹配。

任何帮助都会非常感激!!

Answer 1

您可以简单地have a function that reads your URL var然后过滤表格。我想你通过q = Firefox作为搜索

// Read a page's GET URL variables and return them as an associative array.
function getUrlVars()
{
 var vars = {};
    var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value) {
        vars[key] = value;
    });
    return vars;

}

$(document).ready(function() {
    // Get the query from the url
    var query = getUrlVars()['q'];
    // create the table
    var oTable = $('#example').dataTable();
    // Filter it
    oTable.fnFilter( query, 2 );
});

在此处http://fiddle.jshell.net/9CxYT/17/show/?q=Firefox

Answer 2

这是一个老问题，但在搜索解决方案时仍然会出现问题。这就是我做的工作。

$(document).ready( function() {
  
  // First, get the search parameter. Here I use example.com#search=yourkeyword
    var searchHash = location.hash.substr(1),
        searchString = searchHash.substr(searchHash.indexOf('search='))
		                  .split('&')[0]
		                  .split('=')[1];
  
  
  $('#example').dataTable( {
    "oSearch": { "sSearch": searchString }
  } );
} )

Answer 3

这就是我要做的工作：

@Ibriquet的第一部分从URL获取GET参数，我没有更改。可能有更好的方法可以做到这一点，但我没有对此进行研究。

// Read a page's GET URL variables and return them as an associative array.
function getUrlVars()
{
 var vars = {};
    var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value) {
        vars[key] = value;
    });
    return vars;

}

第二部分，我将其包含在$('#tablename').DataTable( { here, right after the column setup }

中

      initComplete: function() {
        this.api().search(getUrlVars()['search']).draw();        
      },

这会将所有内容放在？search =之后，URL中任何＆之前，然后放入搜索字段。

数据表 - 如何在URL中传递搜索参数

3 个答案: