igGrid - set filters

by georgianastasov

HTML

<script src="https://igniteui.com/js/modernizr.min.js"></script>
<script src="https://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="https://code.jquery.com/ui/1.10.3/jquery-ui.min.js"></script>
<script src="https://cdn-na.infragistics.com/igniteui/latest/js/infragistics.core.js"></script>
<script src="https://cdn-na.infragistics.com/igniteui/latest/js/infragistics.lob.js"></script>
<script src="https://igniteui.com/js-data/employee-data-allDatatypes"></script>
<link href="https://cdn-na.infragistics.com/igniteui/latest/css/themes/infragistics/infragistics.theme.css" rel="stylesheet"></link>
<link href="https://cdn-na.infragistics.com/igniteui/latest/css/structure/infragistics.css" rel="stylesheet"></link>


<table id="grid"></table>
<input type="button" id="refresh" value="Refresh" style="margin-top: 1rem;"/>
<input type="button" id="buttonSetFilters" value="Set Filters" style="margin-top: 1rem; margin-left: 1rem;"/>

JavaScript

$(function () {
var empleyees = [
	{FirstName: "Downs", LastName:"Holomb", Country:"Italy", Age:35},
  {FirstName: "Betty", LastName:"Trujillo", Country:"USA", Age:26},
	{FirstName: "Hollowe", LastName:"Hollkins", Country:"Spain", Age:31},
	{FirstName: "Joyce", LastName:"Munoz", Country:"Germany", Age:23},
	{FirstName: "Mcenzie", LastName:"Calderon", Country:"France", Age:27},
  {FirstName: "Jon", LastName:"Davis", Country:"USA", Age:25},
	{FirstName: "Bratt", LastName:"Calvin", Country:"UK", Age:32}
]

var filterExpr;

			$("#grid").igGrid({
				autoGenerateColumns: false,
        height: "400px",
        width: "100%",
				columns: [
                    { headerText: "First Name", key: "FirstName", dataType: "string" },
                    { headerText: "Last Name", key: "LastName", dataType: "string" },
                    { headerText: "Country", key: "Country", dataType: "string" },
                    { headerText: "Age", key: "Age", dataType: "number" },
				],
				dataSource: empleyees,
				responseDataKey: "results",
        //when the grid load/render
        rendered: function(evt, ui) {
        //if there is expresion 
        let localStorageValue = window.localStorage.getItem("key");
        console.log(localStorageValue)
        if(localStorageValue !== "undefined"){
        	filterExpr = jQuery.parseJSON(window.localStorage.getItem("key"));
        }
          if(filterExpr){
          //set again to the grid
          setTimeout(() => {
  					//$("#grid").igGridFiltering("filter", ([filterExpr]));
					}, 100);
          }
        },
        features:[
                    {
                        name: "Filtering",
                        type: "local",
												mode: "simple",
												filterDialogContainment: "window",
                        //when filter the grid
                        dataFiltered: function (evt, ui) {
                        //take its filter expression
                          window.localStorage.setItem("key",...