├── .editorconfig
├── .gitignore
├── .npmignore
├── LICENSE
├── README.md
├── docs
├── .gitkeep
└── demo
│ └── flavorzoom
│ ├── index.html
│ ├── jquery.uitablefilter.js
│ └── my_food_plan_pick_foods.js
├── jquery.uitablefilter.js
├── package.json
└── test
├── tests.js
└── ui_table_filter_spec.html
/.editorconfig:
--------------------------------------------------------------------------------
1 | root = true
2 |
3 | [*]
4 | indent_style = tab
5 | indent_size = 4
6 | charset = utf-8
7 | trim_trailing_whitespace = true
8 | insert_final_newline = true
9 |
--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | /node_modules
2 | /yarn.lock
3 | /package-lock.json
4 | /*.log
5 |
--------------------------------------------------------------------------------
/.npmignore:
--------------------------------------------------------------------------------
1 | /test
2 | /demo
3 | /.editorconfig
4 | /node_modules
5 | /yarn.lock
6 | /package-lock.json
7 | /*.log
8 |
--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
1 | Copyright 2013 jQuery Foundation and other contributors
2 | http://jquery.com/
3 |
4 | Permission is hereby granted, free of charge, to any person obtaining
5 | a copy of this software and associated documentation files (the
6 | "Software"), to deal in the Software without restriction, including
7 | without limitation the rights to use, copy, modify, merge, publish,
8 | distribute, sublicense, and/or sell copies of the Software, and to
9 | permit persons to whom the Software is furnished to do so, subject to
10 | the following conditions:
11 |
12 | The above copyright notice and this permission notice shall be
13 | included in all copies or substantial portions of the Software.
14 |
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
16 | EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
17 | MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
18 | NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
19 | LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
20 | OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
21 | WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
22 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # Repository
2 |
3 | [](https://badge.fury.io/js/jquery-uitablefilter)
4 |
5 | https://github.com/code-tls/jquery-uitablefilter
6 |
7 | ## Download
8 | Download the latest version here : https://github.com/code-tls/jquery-uitablefilter/blob/master/jquery.uitablefilter.js
9 |
10 | ## Install
11 |
12 | ```bash
13 | npm install jquery-uitablefilter
14 | ```
15 | or yarn
16 |
17 | ```bash
18 | yarn add jquery-uitablefilter
19 | ```
20 |
21 | ## Example
22 | Here is an example (see the original project README for more informations). It will search for the word 'Pepper' in #table in columns 'Price', 'Item' and 'ID'.
23 |
24 | ```js
25 | $.uiTableFilter($('#table'), 'Pepper', ['Price', 'Item', 'D']);
26 | ```
27 |
28 | ## Demo
29 |
30 | Here is a [http://code-tls.github.io/jquery-uitablefilter/demo/flavorzoom/](demo).
31 |
--------------------------------------------------------------------------------
/docs/.gitkeep:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/code-lts/jquery-uitablefilter/9d52774a67011fb91aeb2c08f27e31eda1587bfb/docs/.gitkeep
--------------------------------------------------------------------------------
/docs/demo/flavorzoom/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 | Check off the foods you want to eat today.
8 |
9 |
11 |
13 |
14 |
15 |
16 |
17 |
18 |
19 |
190 |
191 |
192 |
193 |
194 |
195 |
--------------------------------------------------------------------------------
/docs/demo/flavorzoom/jquery.uitablefilter.js:
--------------------------------------------------------------------------------
1 | /*
2 | * Copyright (c) 2008 Greg Weber greg at gregweber.info
3 | * Dual licensed under the MIT and GPLv2 licenses just as jQuery is:
4 | * http://jquery.org/license
5 | *
6 | * Multi-columns support by natinusala
7 | *
8 | * documentation at http://gregweber.info/projects/uitablefilter
9 | *
10 | * allows table rows to be filtered (made invisible)
11 | *
12 | * t = $('table')
13 | * $.uiTableFilter( t, phrase )
14 | *
15 | * arguments:
16 | * jQuery object containing table rows
17 | * phrase to search for
18 | * optional arguments:
19 | * array of columns to limit search too (the column title in the table header)
20 | * ifHidden - callback to execute if one or more elements was hidden
21 | * tdElem - specific element within
to be considered for searching or to limit search to,
22 | * default:whole
. useful if
has more than one elements inside but want to
23 | * limit search within only some of elements or only visible elements. eg tdElem can be "td span"
24 | */
25 | (function ($) {
26 | $.uiTableFilter = function (jq, phrase, column, ifHidden, tdElem) {
27 | if (!tdElem) tdElem = "td";
28 | var new_hidden = false;
29 | if (this.last_phrase === phrase) return false;
30 |
31 | var phrase_length = phrase.length;
32 | var words = phrase.toLowerCase().split(" ");
33 |
34 | // these function pointers may change
35 | var matches = function (elem) { elem.show() }
36 | var noMatch = function (elem) { elem.hide(); new_hidden = true }
37 | var getText = function (elem) { return elem.text() }
38 |
39 | if (column) {
40 | if (!$.isArray(column)) {
41 | column = new Array(column);
42 | }
43 |
44 | var index = new Array();
45 |
46 | jq.find("thead > tr:last > th").each(function (i) {
47 | for (var j = 0; j < column.length; j++) {
48 | if ($.trim($(this).text()) == column[j]) {
49 | index[j] = i;
50 | break;
51 | }
52 | }
53 |
54 | });
55 |
56 | getText = function (elem) {
57 | var selector = "";
58 | for (var i = 0; i < index.length; i++) {
59 | if (i != 0) { selector += ","; }
60 | selector += tdElem + ":eq(" + index[i] + ")";
61 | }
62 | return $(elem.find((selector))).text();
63 | }
64 | }
65 |
66 | // if added one letter to last time,
67 | // just check newest word and only need to hide
68 | if ((words.size > 1) && (phrase.substr(0, phrase_length - 1) ===
69 | this.last_phrase)) {
70 |
71 | if (phrase[-1] === " ") { this.last_phrase = phrase; return false; }
72 |
73 | var words = words[-1]; // just search for the newest word
74 |
75 | // only hide visible rows
76 | matches = function (elem) { ; }
77 | var elems = jq.find("tbody:first > tr:visible")
78 | }
79 | else {
80 | new_hidden = true;
81 | var elems = jq.find("tbody:first > tr")
82 | }
83 |
84 | elems.each(function () {
85 | var elem = $(this);
86 | $.uiTableFilter.has_words(getText(elem), words, false) ?
87 | matches(elem) : noMatch(elem);
88 | });
89 |
90 | last_phrase = phrase;
91 | if (ifHidden && new_hidden) ifHidden();
92 | return jq;
93 | };
94 |
95 | // caching for speedup
96 | $.uiTableFilter.last_phrase = ""
97 |
98 | // not jQuery dependent
99 | // "" [""] -> Boolean
100 | // "" [""] Boolean -> Boolean
101 | $.uiTableFilter.has_words = function (str, words, caseSensitive) {
102 | var text = caseSensitive ? str : str.toLowerCase();
103 | for (var i = 0; i < words.length; i++) {
104 | if (text.indexOf(words[i]) === -1) return false;
105 | }
106 | return true;
107 | }
108 | })(jQuery);
109 |
--------------------------------------------------------------------------------
/docs/demo/flavorzoom/my_food_plan_pick_foods.js:
--------------------------------------------------------------------------------
1 | $(function () {
2 | var theTable = $('table.food_planner')
3 |
4 | theTable.find("tbody > tr").find("td:eq(1)").mousedown(function () {
5 | $(this).prev().find(":checkbox").click()
6 | });
7 |
8 | $("#filter").keyup(function () {
9 | $.uiTableFilter(theTable, this.value);
10 | })
11 |
12 | $('#filter-form').submit(function () {
13 | theTable.find("tbody > tr:visible > td:eq(1)").mousedown();
14 | return false;
15 | }).focus(); //Give focus to input field
16 | });
17 |
--------------------------------------------------------------------------------
/jquery.uitablefilter.js:
--------------------------------------------------------------------------------
1 | /*
2 | * Copyright (c) 2008 Greg Weber greg at gregweber.info
3 | * Dual licensed under the MIT and GPLv2 licenses just as jQuery is:
4 | * http://jquery.org/license
5 | *
6 | * Multi-columns support by natinusala
7 | *
8 | * documentation at http://gregweber.info/projects/uitablefilter
9 | *
10 | * allows table rows to be filtered (made invisible)
11 | *
12 | * t = $('table')
13 | * $.uiTableFilter( t, phrase )
14 | *
15 | * arguments:
16 | * jQuery object containing table rows
17 | * phrase to search for
18 | * optional arguments:
19 | * array of columns to limit search too (the column title in the table header)
20 | * ifHidden - callback to execute if one or more elements was hidden
21 | * tdElem - specific element within
to be considered for searching or to limit search to,
22 | * default:whole
. useful if
has more than one elements inside but want to
23 | * limit search within only some of elements or only visible elements. eg tdElem can be "td span"
24 | */
25 | (function ($) {
26 | $.uiTableFilter = function (jq, phrase, column, ifHidden, tdElem) {
27 | if (!tdElem) tdElem = "td";
28 | var new_hidden = false;
29 | if (this.last_phrase === phrase) return false;
30 |
31 | var phrase_length = phrase.length;
32 | var words = phrase.toLowerCase().split(" ");
33 |
34 | // these function pointers may change
35 | var matches = function (elem) { elem.show() }
36 | var noMatch = function (elem) { elem.hide(); new_hidden = true }
37 | var getText = function (elem) { return elem.text() }
38 |
39 | if (column) {
40 | if (!$.isArray(column)) {
41 | column = new Array(column);
42 | }
43 |
44 | var index = new Array();
45 |
46 | jq.find("thead > tr:last > th").each(function (i) {
47 | for (var j = 0; j < column.length; j++) {
48 | if ($.trim($(this).text()) == column[j]) {
49 | index[j] = i;
50 | break;
51 | }
52 | }
53 |
54 | });
55 |
56 | getText = function (elem) {
57 | var selector = "";
58 | for (var i = 0; i < index.length; i++) {
59 | if (i != 0) { selector += ","; }
60 | selector += tdElem + ":eq(" + index[i] + ")";
61 | }
62 | return $(elem.find((selector))).text();
63 | }
64 | }
65 |
66 | // if added one letter to last time,
67 | // just check newest word and only need to hide
68 | if ((words.size > 1) && (phrase.substr(0, phrase_length - 1) ===
69 | this.last_phrase)) {
70 |
71 | if (phrase[-1] === " ") { this.last_phrase = phrase; return false; }
72 |
73 | var words = words[-1]; // just search for the newest word
74 |
75 | // only hide visible rows
76 | matches = function (elem) { ; }
77 | var elems = jq.find("tbody:first > tr:visible")
78 | }
79 | else {
80 | new_hidden = true;
81 | var elems = jq.find("tbody:first > tr")
82 | }
83 |
84 | elems.each(function () {
85 | var elem = $(this);
86 | $.uiTableFilter.has_words(getText(elem), words, false) ?
87 | matches(elem) : noMatch(elem);
88 | });
89 |
90 | last_phrase = phrase;
91 | if (ifHidden && new_hidden) ifHidden();
92 | return jq;
93 | };
94 |
95 | // caching for speedup
96 | $.uiTableFilter.last_phrase = ""
97 |
98 | // not jQuery dependent
99 | // "" [""] -> Boolean
100 | // "" [""] Boolean -> Boolean
101 | $.uiTableFilter.has_words = function (str, words, caseSensitive) {
102 | var text = caseSensitive ? str : str.toLowerCase();
103 | for (var i = 0; i < words.length; i++) {
104 | if (text.indexOf(words[i]) === -1) return false;
105 | }
106 | return true;
107 | }
108 | })(jQuery);
109 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "jquery-uitablefilter",
3 | "version": "1.0.0",
4 | "description": "jQuery UI table filter",
5 | "main": "jquery.uitablefilter.js",
6 | "repository": "https://github.com/code-tls/jquery-uitablefilter",
7 | "author": {
8 | "name": "Greg Weber",
9 | "email": "greg@gregweber.info"
10 | },
11 | "license": "MIT",
12 | "homepage": "https://github.com/code-tls/jquery-uitablefilter#readme",
13 | "keywords": [
14 | "jquery",
15 | "ui",
16 | "uitablefilter"
17 | ],
18 | "readme": "https://github.com/code-tls/jquery-uitablefilter#readme",
19 | "dependencies": {},
20 | "devDependencies": {
21 | "chai": "^4.2.0",
22 | "mocha": "^7.1.1"
23 | }
24 | }
25 |
--------------------------------------------------------------------------------
/test/tests.js:
--------------------------------------------------------------------------------
1 | var expect = chai.expect;
2 |
3 | describe('has_words', () => {
4 | before(function () {
5 | thw = 'test has words'
6 | has_words = $.uiTableFilter.has_words
7 | });
8 |
9 | it('should return true when word is present', function () {
10 | expect(has_words(thw, ['t'])).to.be.true;
11 | expect(has_words(thw, ['t'])).to.be.true;
12 | expect(has_words(thw, ['te'])).to.be.true;
13 | expect(has_words(thw, ['tes'])).to.be.true;
14 | expect(has_words(thw, ['test'])).to.be.true;
15 | expect(has_words(thw, [' has '])).to.be.true;
16 | expect(has_words(thw, ['words'])).to.be.true;
17 | expect(has_words(thw, ['test has words'])).to.be.true;
18 | expect(has_words(thw, ['test', 'has'])).to.be.true;
19 | expect(has_words(thw, ['test', 'has', 'words'])).to.be.true;
20 | });
21 | it('should return false when word is not present', function () {
22 | expect(has_words(thw, ['z'])).to.be.false;
23 | expect(has_words(thw, ['tz'])).to.be.false;
24 | expect(has_words(thw, ['t', 'z'])).to.be.false;
25 | expect(has_words(thw, ['test has z'])).to.be.false;
26 | expect(has_words(thw, ['test', 'has', 'z'])).to.be.false;
27 | });
28 | it('should be optionally case sensitive', function () {
29 | expect(has_words(thw, ['T'], true)).to.be.false;
30 | expect(has_words(thw, ['tE'], true)).to.be.false;
31 | expect(has_words(thw, ['t', 'wOr'], true)).to.be.false;
32 | expect(has_words(thw, ['test has'], false)).to.be.true;
33 | });
34 | });
35 |
36 | describe('filterNormalTable', () => {
37 | before(function () {
38 | var theTable = $("#testtable")
39 | filter = function (pattern) {
40 | $.uiTableFilter(theTable, pattern, 0);
41 | }
42 |
43 | resetFilter = function () {
44 | filter('');
45 | }
46 | });
47 |
48 | after(function () {
49 | resetFilter();
50 | });
51 |
52 | it('no filter, all rows must be visible', function () {
53 |
54 | filter('')
55 | expect($('#headrow:visible').html()).to.equal($('#headrow').html())
56 | expect($('#testrow1:visible').html()).to.equal($('#testrow1').html())
57 | expect($('#testrow2:visible').html()).to.equal($('#testrow2').html())
58 | });
59 |
60 | it('simple filter 1', function () {
61 |
62 | filter('turtle')
63 | expect($('#headrow:visible').html()).to.equal($('#headrow').html())
64 | expect($('#testrow1:visible').html()).to.equal($('#testrow1').html())
65 | expect($('#testrow2:visible').html()).to.equal(undefined);
66 | });
67 |
68 | it('simple filter 2', function () {
69 |
70 | filter('dog')
71 | expect($('#headrow:visible').html()).to.equal($('#headrow').html())
72 | expect($('#testrow1:visible').html()).to.equal($('#testrow1').html())
73 | expect($('#testrow2:visible').html()).to.equal(undefined);
74 | });
75 |
76 | it('simple filter 3', function () {
77 |
78 | filter('whale')
79 | expect($('#headrow:visible').html()).to.equal($('#headrow').html())
80 | expect($('#testrow1:visible').html()).to.equal(undefined);
81 | expect($('#testrow2:visible').html()).to.equal($('#testrow2').html())
82 | });
83 |
84 | it('simple head filter (head must still be visible)', function () {
85 |
86 | filter('sea')
87 | expect($('#headrow:visible').html()).to.equal($('#headrow').html())
88 | expect($('#testrow1:visible').html()).to.equal(undefined);
89 | expect($('#testrow2:visible').html()).to.equal(undefined);
90 | });
91 |
92 | it('simple filter an resetFilter', function () {
93 | filter('turtle')
94 | expect($('#headrow:visible').html()).to.equal($('#headrow').html())
95 | expect($('#testrow1:visible').html()).to.equal($('#testrow1').html())
96 | expect($('#testrow2:visible').html()).to.equal(undefined);
97 | filter('')
98 | expect($('#headrow:visible').html()).to.equal($('#headrow').html())
99 | expect($('#testrow1:visible').html()).to.equal($('#testrow1').html())
100 | expect($('#testrow2:visible').html()).to.equal($('#testrow2').html())
101 | });
102 | });
103 |
104 |
105 | describe('filterInnerTable', () => {
106 | before(function () {
107 | var theTable = $("#testtable2")
108 | filter = function (pattern) {
109 | $.uiTableFilter(theTable, pattern, 0);
110 | }
111 |
112 | resetFilter = function () {
113 | filter('');
114 | }
115 | });
116 |
117 | after(function () {
118 | resetFilter();
119 | });
120 |
121 | it('no filter, all rows must be visible', function () {
122 |
123 | filter('')
124 | expect($('#headrow2:visible').html()).to.equal($('#headrow2').html())
125 | expect($('#testrow2.1:visible').html()).to.equal($('#testrow2.1').html())
126 | expect($('#testrow2.2:visible').html()).to.equal($('#testrow2.2').html())
127 | expect($('#innerHeadRow:visible').html()).to.equal($('#innerHeadRow').html())
128 | expect($('#innerRow1:visible').html()).to.equal($('#innerRow1').html())
129 | expect($('#innerRow2:visible').html()).to.equal($('#innerRow2').html())
130 | });
131 |
132 |
133 | it('filter for non existing value', function () {
134 |
135 | filter('blaBlubb')
136 | expect($('#headrow2:visible').html()).to.equal($('#headrow2').html())
137 | expect($('#testrow2.1:visible').html()).to.equal($('#testrow2.1').html())
138 | expect($('#testrow2.2:visible').html()).to.equal(undefined);
139 | expect($('#innerHeadRow:visible').html()).to.equal(undefined);//to.equal($('#innerHeadRow').html())
140 | expect($('#innerRow1:visible').html()).to.equal(undefined);//to.equal($('#innerRow1').html())
141 | expect($('#innerRow2:visible').html()).to.equal(undefined);//to.equal($('#innerRow2').html())
142 | });
143 |
144 | it('filter for existing value (complete inner table must disappear)', function () {
145 |
146 | filter('whale')
147 | expect($('#headrow2:visible').html()).to.equal($('#headrow2').html())
148 | expect($('#testrow2.1:visible').html()).to.equal(undefined);
149 | expect($('#testrow2.2:visible').html()).to.equal(undefined);
150 | expect($('#innerHeadRow:visible').html()).to.equal(undefined);//to.equal($('#innerHeadRow').html())
151 | expect($('#innerRow1:visible').html()).to.equal(undefined);//to.equal($('#innerRow1').html())
152 | expect($('#innerRow2:visible').html()).to.equal(undefined);//to.equal($('#innerRow2').html())
153 | });
154 |
155 | it('filter for existing value which is in the inner table (all rows should disappear, but inner table should be (theoreticaly) visible)', function () {
156 |
157 | filter('turtle')
158 | expect($('#headrow2:visible').html()).to.equal($('#headrow2').html())
159 | expect($('#testrow2.1:visible').html()).to.equal($('#testrow2.1').html())
160 | expect($('#testrow2.2:visible').html()).to.equal(undefined);
161 | expect($('#innerHeadRow:visible').html()).to.equal($('#innerHeadRow').html())
162 | expect($('#innerRow1:visible').html()).to.equal($('#innerRow1').html())
163 | expect($('#innerRow2:visible').html()).to.equal($('#innerRow2').html())
164 | });
165 |
166 |
167 | });
168 |
--------------------------------------------------------------------------------
/test/ui_table_filter_spec.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | Mocha Tests
6 |
7 |
8 |
9 |
10 |