From 51527ac76220dfe1b54656c346d609f7b968d52d Mon Sep 17 00:00:00 2001 From: Piero Wbmstr Date: Sat, 22 Mar 2014 09:15:46 +0100 Subject: [PATCH] New "quickListSelector" option MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - the new « quickListSelector » option (null by default) allows user to insert quick list items in an existing DOM element - update of the README to add the new option « how-to » - new « filterable-quick-dom-insert.html » example --- README.md | 1 + examples/filtertable-quick-dom-insert.html | 105 +++++++++++++++++++++ jquery.filtertable.js | 11 ++- jquery.filtertable.min.js | 4 +- 4 files changed, 116 insertions(+), 5 deletions(-) create mode 100644 examples/filtertable-quick-dom-insert.html diff --git a/README.md b/README.md index ea0b779..a670a79 100644 --- a/README.md +++ b/README.md @@ -49,6 +49,7 @@ $('table').filterTable(); //if this code appears after your tables; otherwise, i | `quickListClass` | string | quick | Class of each quick list item | | `quickListGroupTag` | string | '' | Tag name surrounding quick list items (e.g., `ul`) | | `quickListTag` | string | a | Tag name of each quick list item (e.g., `a` or `li`) | +| `quickListSelector` | string | _null_ | Use this selector to find the quick list container instead of creating a new one (only works if selector returns a single element) | | `visibleClass` | string | visible | Class applied to visible rows | ## Styling diff --git a/examples/filtertable-quick-dom-insert.html b/examples/filtertable-quick-dom-insert.html new file mode 100644 index 0000000..9654d09 --- /dev/null +++ b/examples/filtertable-quick-dom-insert.html @@ -0,0 +1,105 @@ + + + + + + jQuery.FilterTable Quick List In Existing DOM Element Sample + + + +

jQuery.FilterTable Quick List In Existing DOM Element Sample

+

This is a very plain sample of the jQuery.FilterTable plugin which shows the usage of the quickList optional parameter.

+

Quick list may be inserted here:

+

Main campuses of the University of Hawaiʻi System

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
CampusIslandFall 2011
Enrollment
University of Hawaiʻi at HiloHawaiʻi 4,100
University of Hawaiʻi at MānoaOʻahu20,400
University of Hawaiʻi—West OʻahuOʻahu1,600
Hawaiʻi Community CollegeHawaiʻi 3,900
Honolulu Community CollegeOʻahu4,600
Kapiʻolani Community CollegeOʻahu9,000
Kauaʻi Community CollegeKauaʻi 1,400
Leeward Community CollegeOʻahu7,900
Maui CollegeMaui 4,500
Windward Community CollegeOʻahu2,700
+

Note that while the filter is case-insensitive, it is UTF-8 aware so searching for oahu will not find Oʻahu.

+ + + + + + \ No newline at end of file diff --git a/jquery.filtertable.js b/jquery.filtertable.js index 8c43476..93a82b5 100644 --- a/jquery.filtertable.js +++ b/jquery.filtertable.js @@ -6,7 +6,7 @@ * * Utilizes bindWithDelay() if available. https://github.com/bgrins/bindWithDelay * - * @version v1.5.2 + * @version v1.5.2 (modified) * @author Sunny Walker, swalker@hawaii.edu */ (function($) { @@ -40,6 +40,7 @@ quickListClass: 'quick', // class of each quick list item quickListGroupTag: '', // tag surrounding quick list items (e.g., ul) quickListTag: 'a', // tag type of each quick list item (e.g., a or li) + quickListSelector: null, // selector for an existing quick list container visibleClass: 'visible' // class applied to visible rows }, hsc = function(text) { // mimic PHP's htmlspecialchars() function @@ -106,7 +107,11 @@ container.append(filter); } if (settings.quickList.length>0) { // are there any quick list items to add? - quicks = settings.quickListGroupTag ? $('<'+settings.quickListGroupTag+' />') : container; + if (settings.quickListSelector && $(settings.quickListSelector).length===1) { + quicks = $(settings.quickListSelector); // get the existing container tag for the quick list + } else { + quicks = settings.quickListGroupTag ? $('<'+settings.quickListGroupTag+' />') : container; + } $.each(settings.quickList, function(index, value) { // for each quick list item... var q = $('<'+settings.quickListTag+' class="'+settings.quickListClass+'" />'); // build the quick list item link q.text(hsc(value)); // add the item's text @@ -119,7 +124,7 @@ }); quicks.append(q); // add the quick list link to the quick list groups container }); // each quick list item - if (quicks!==container) { + if (quicks!==container && (settings.quickListSelector===null || $(settings.quickListSelector).length==0)) { container.append(quicks); // add the quick list groups container to the DOM if it isn't already there } } // if quick list items diff --git a/jquery.filtertable.min.js b/jquery.filtertable.min.js index 459ec3d..c47c851 100644 --- a/jquery.filtertable.min.js +++ b/jquery.filtertable.min.js @@ -6,7 +6,7 @@ * * Utilizes bindWithDelay() if available. https://github.com/bgrins/bindWithDelay * - * @version v1.5.2 + * @version v1.5.2 (modified) * @author Sunny Walker, swalker@hawaii.edu */ -!function(e){var t=e.fn.jquery.split("."),i=parseFloat(t[0]),a=parseFloat(t[1]);e.expr[":"].filterTableFind=2>i&&8>a?function(t,i,a){return e(t).text().toUpperCase().indexOf(a[3].toUpperCase())>=0}:jQuery.expr.createPseudo(function(t){return function(i){return e(i).text().toUpperCase().indexOf(t.toUpperCase())>=0}}),e.fn.filterTable=function(t){var i={autofocus:!1,callback:null,containerClass:"filter-table",containerTag:"p",hideTFootOnFilter:!1,highlightClass:"alt",inputSelector:null,inputName:"",inputType:"search",label:"Filter:",minRows:8,placeholder:"search this table",quickList:[],quickListClass:"quick",quickListGroupTag:"",quickListTag:"a",visibleClass:"visible"},a=function(e){return e.replace(/&/g,"&").replace(/"/g,""").replace(//g,">")},l=e.extend({},i,t),n=function(e,t){var i=e.find("tbody");""===t?(i.find("tr").show().addClass(l.visibleClass),i.find("td").removeClass(l.highlightClass),l.hideTFootOnFilter&&e.find("tfoot").show()):(i.find("tr").hide().removeClass(l.visibleClass),l.hideTFootOnFilter&&e.find("tfoot").hide(),i.find("td").removeClass(l.highlightClass).filter(':filterTableFind("'+t.replace(/(['"])/g,"\\$1")+'")').addClass(l.highlightClass).closest("tr").show().addClass(l.visibleClass)),l.callback&&l.callback(t,e)};return this.each(function(){var t=e(this),i=t.find("tbody"),s=null,r=null,o=null,c=!0;"TABLE"===t[0].nodeName&&i.length>0&&(0===l.minRows||l.minRows>0&&i.find("tr").length>l.minRows)&&!t.prev().hasClass(l.containerClass)&&(l.filterSelector&&1===e(l.filterSelector).length?(o=e(l.filterSelector),s=o.parent(),c=!1):(s=e("<"+l.containerTag+" />"),""!==l.containerClass&&s.addClass(l.containerClass),s.prepend(l.label+" "),o=e('')),l.autofocus&&o.attr("autofocus",!0),e.fn.bindWithDelay?o.bindWithDelay("keyup",function(){n(t,e(this).val())},200):o.bind("keyup",function(){n(t,e(this).val())}),o.bind("click search",function(){n(t,e(this).val())}),c&&s.append(o),l.quickList.length>0&&(r=l.quickListGroupTag?e("<"+l.quickListGroupTag+" />"):s,e.each(l.quickList,function(t,i){var n=e("<"+l.quickListTag+' class="'+l.quickListClass+'" />');n.text(a(i)),"A"===n[0].nodeName&&n.attr("href","#"),n.bind("click",function(e){e.preventDefault(),o.val(i).focus().trigger("click")}),r.append(n)}),r!==s&&s.append(r)),c&&t.before(s))})}}(jQuery); \ No newline at end of file +(function(e){var t=e.fn.jquery.split("."),n=parseFloat(t[0]),r=parseFloat(t[1]);if(n<2&&r<8){e.expr[":"].filterTableFind=function(t,n,r){return e(t).text().toUpperCase().indexOf(r[3].toUpperCase())>=0}}else{e.expr[":"].filterTableFind=jQuery.expr.createPseudo(function(t){return function(n){return e(n).text().toUpperCase().indexOf(t.toUpperCase())>=0}})}e.fn.filterTable=function(t){var n={autofocus:false,callback:null,containerClass:"filter-table",containerTag:"p",hideTFootOnFilter:false,highlightClass:"alt",inputSelector:null,inputName:"",inputType:"search",label:"Filter:",minRows:8,placeholder:"search this table",quickList:[],quickListClass:"quick",quickListGroupTag:"",quickListTag:"a",quickListSelector:null,visibleClass:"visible"},r=function(e){return e.replace(/&/g,"&").replace(/"/g,""").replace(//g,">")},i=e.extend({},n,t);var s=function(e,t){var n=e.find("tbody");if(t===""){n.find("tr").show().addClass(i.visibleClass);n.find("td").removeClass(i.highlightClass);if(i.hideTFootOnFilter){e.find("tfoot").show()}}else{n.find("tr").hide().removeClass(i.visibleClass);if(i.hideTFootOnFilter){e.find("tfoot").hide()}n.find("td").removeClass(i.highlightClass).filter(':filterTableFind("'+t.replace(/(['"])/g,"\\$1")+'")').addClass(i.highlightClass).closest("tr").show().addClass(i.visibleClass)}if(i.callback){i.callback(t,e)}};return this.each(function(){var t=e(this),n=t.find("tbody"),o=null,u=null,a=null,f=true;if(t[0].nodeName==="TABLE"&&n.length>0&&(i.minRows===0||i.minRows>0&&n.find("tr").length>i.minRows)&&!t.prev().hasClass(i.containerClass)){if(i.filterSelector&&e(i.filterSelector).length===1){a=e(i.filterSelector);o=a.parent();f=false}else{o=e("<"+i.containerTag+" />");if(i.containerClass!==""){o.addClass(i.containerClass)}o.prepend(i.label+" ");a=e('')}if(i.autofocus){a.attr("autofocus",true)}if(e.fn.bindWithDelay){a.bindWithDelay("keyup",function(){s(t,e(this).val())},200)}else{a.bind("keyup",function(){s(t,e(this).val())})}a.bind("click search",function(){s(t,e(this).val())});if(f){o.append(a)}if(i.quickList.length>0){if(i.quickListSelector&&e(i.quickListSelector).length===1){u=e(i.quickListSelector)}else{u=i.quickListGroupTag?e("<"+i.quickListGroupTag+" />"):o}e.each(i.quickList,function(t,n){var s=e("<"+i.quickListTag+' class="'+i.quickListClass+'" />');s.text(r(n));if(s[0].nodeName==="A"){s.attr("href","#")}s.bind("click",function(e){e.preventDefault();a.val(n).focus().trigger("click")});u.append(s)});if(u!==o&&(i.quickListSelector===null||e(i.quickListSelector).length==0)){o.append(u)}}if(f){t.before(o)}}})}})(jQuery); \ No newline at end of file