I have the local storage piece working from the first page but am having trouble using it as an array to indexOf values on the second page to determine which table rows should be hidden. Lots of trouble...
Here is the script I've written to try to do this. All the verbose html I left for jsfiddle because its overwhelming the woods.
//THIS updates LOCALSTORAGE AFTER EACH CHECKBOX CLICK. USE ON PAGE 1
$(document).ready(function () {
$(":checkbox").click(function () {
var arr = [];
$("input:checkbox:checked").each(function () {
arr.push($(this).parent().parent().parent().find('nobr').text());
});
localStorage.setItem("key", arr);
alert("localStorage= " + localStorage.getItem("key")); // SHOWS US WHAT IS IN ARRAY
});
//THIS TRIES TO GET LOCALSTORAGE FROM ABOVE AND HIDE TR ELEMENTS WHOSE A ELEMENT TEXT VALUES ARE NOT PART OF ARRAY Fro PAGE 1
$("#filter").click(function () {
var arr1 = localStorage.getItem("key");
//alert(arr1);
var attrText = $(".s4-itm-cbx").attr("title");
// alert(attrText);
$(attrText).each(function () {
if (jQuery.inArray( attrText, arr1 )==-1)
$(this).parent().parent().parent(). hide();
});
});
});