jQuery Grid

Set the altrows property of the jqxGrid. Author: http://jqwidgets.com

HTML

<script src="https://jqwidgets.com/public/jqwidgets/jqx-all.js"></script>
<link rel="stylesheet" href="https://jqwidgets.com/public/jqwidgets/styles/jqx.base.css">
<link rel="stylesheet" href="https://jqwidgets.com/public/jqwidgets/styles/jqx.energyblue.css">
<div id="grid"></div>

JavaScript

var data = '[{ "CompanyName": "", "ContactName": "Maria Anders", "ContactTitle": "Sales Representative", "Address": "Obere Str. 57", "City": "Berlin", "Country": "Germany" },{ "CompanyName": "", "ContactName": "Maria Anders", "ContactTitle": "Sales Representative", "Address": "Obere Str. 57", "City": "Berlin", "Country": "Germany" },{ "CompanyName": "Alfreds Futterkiste", "ContactName": "Maria Anders", "ContactTitle": "Sales Representative", "Address": "Obere Str. 57", "City": "Berlin", "Country": "Germany" }, { "CompanyName": "Ana Trujillo Emparedados y helados", "ContactName": "Ana Trujillo", "ContactTitle": "Owner", "Address": "Avda. de la Constitucin 2222", "City": "Mxico D.F.", "Country": "Mexico" }, { "CompanyName": "Antonio Moreno Taquera", "ContactName": "Antonio Moreno", "ContactTitle": "Owner", "Address": "Mataderos 2312", "City": "Mxico D.F.", "Country": "Mexico" }, { "CompanyName": "Around the Horn", "ContactName": "Thomas Hardy", "ContactTitle": "Sales Representative", "Address": "120 Hanover Sq.", "City": "London", "Country": "UK" }, { "CompanyName": "Berglunds snabbkp", "ContactName": "Christina Berglund", "ContactTitle": "Order Administrator", "Address": "Berguvsvgen 8", "City": "Lule", "Country": "Sweden" }]';

var addfilter = function(selectedItem) {
  var filtergroup = new $.jqx.filter();
  var filter_or_operator = 1;
  var filtervalue = '';
  var filtercondition = 'equal';
  var filter1 = filtergroup.createfilter('stringfilter', filtervalue, filtercondition);
  var filter2 = filtergroup.createfilter('stringfilter', selectedItem, filtercondition);

  filtergroup.addfilter(filter_or_operator, filter1);
  filtergroup.addfilter(filter_or_operator, filter2);


  $('#grid').jqxGrid('addfilter', 'CompanyName', filtergroup);
  $("#grid").jqxGrid('applyfilters');
}

// prepare the data
var source = {
  datatype: "json",
  datafields: [{
      name: 'CompanyName',
      type: 'string'
    },
    {
      name: 'ContactName',
      type: 'string'
    },
 ...