diff --git a/dist/js/widgets/widget-columnSelector.min.js b/dist/js/widgets/widget-columnSelector.min.js index aec17033..9bc17807 100644 --- a/dist/js/widgets/widget-columnSelector.min.js +++ b/dist/js/widgets/widget-columnSelector.min.js @@ -1 +1 @@ -!function(a){"use strict";var b=a.tablesorter,c=".tscolsel",d=b.columnSelector={queryAll:"@media only all { [columns] { display: none; } } ",queryBreak:"@media all and (min-width: [size]) { [columns] { display: table-cell; } } ",init:function(b,e,f){var g,h;return g=a(f.columnSelector_layout),g.find("input").add(g.filter("input")).length?(e.$table.addClass(e.namespace.slice(1)+"columnselector"),h=e.selector={$container:a(f.columnSelector_container||"
")},h.$style=a("").prop("disabled",!0).appendTo("head"),h.$breakpoints=a("").prop("disabled",!0).appendTo("head"),h.isInitializing=!0,d.setupSelector(e,f),f.columnSelector_mediaquery&&d.setupBreakpoints(e,f),h.isInitializing=!1,h.$container.length?d.updateCols(e,f):e.debug&&console.warn("ColumnSelector: >> container not found"),void e.$table.off("refreshColumnSelector"+c).on("refreshColumnSelector"+c,function(a,b,c){d.refreshColumns(this.config,b,c)})):void(e.debug&&console.error("ColumnSelector: >> ERROR: Column Selector aborting, no input found in the layout! ***"))},refreshColumns:function(b,c,e){var f,g,h=a.isArray(e||c),i=b.widgetOptions;if("undefined"!=typeof c&&b.selector.$container.length){if("selectors"===c&&(b.selector.$container.empty(),d.setupSelector(b,i),d.setupBreakpoints(b,i),"undefined"==typeof e&&(e=b.selector.auto)),h)for(g=e||c,a.each(g,function(a,b){g[a]=parseInt(b,10)}),f=0;f=0);d.updateAuto(b,i,b.selector.$container.find('input[data-column="auto"]').prop("checked",e===!0||c===!0||"auto"===c&&e!==!1))}else d.updateBreakpoints(b,i),d.updateCols(b,i)},setupSelector:function(c,e){var f,g=c.selector,h=g.$container,i=e.columnSelector_saveColumns&&b.storage,j=i?b.storage(c.table,"tablesorter-columnSelector"):[],k=i?b.storage(c.table,"tablesorter-columnSelector-auto"):{};g.auto=a.isEmptyObject(k)||"boolean"!==a.type(k.auto)?e.columnSelector_mediaqueryState:k.auto,g.states=[],g.$column=[],g.$wrapper=[],g.$checkbox=[],c.$table.children("thead").find("tr:first th",c.table).each(function(){var i=a(this),k=i.attr(e.columnSelector_priority)||1,l=i.attr("data-column"),m=b.getColumnData(c.table,c.headers,l),n=b.getData(this,m,"columnSelector");return isNaN(k)&&k.length>0||"disable"===n||e.columnSelector_columns[l]&&"disable"===e.columnSelector_columns[l]?!0:(g.states[l]=j&&"undefined"!=typeof j[l]?j[l]:"undefined"!=typeof e.columnSelector_columns[l]?e.columnSelector_columns[l]:"true"===n||"false"!==n,g.$column[l]=a(this),f=i.attr(e.columnSelector_name)||i.text(),void(h.length&&(g.$wrapper[l]=a(e.columnSelector_layout.replace(/\{name\}/g,f)).appendTo(h),g.$checkbox[l]=g.$wrapper[l].find("input").add(g.$wrapper[l].filter("input")).attr("data-column",l).toggleClass(e.columnSelector_cssChecked,g.states[l]).prop("checked",g.states[l]).on("change",function(){g.states[l]=this.checked,d.updateCols(c,e)}).change())))})},setupBreakpoints:function(b,e){var f=b.selector;e.columnSelector_mediaquery&&(f.lastIndex=-1,d.updateBreakpoints(b,e),b.$table.off("updateAll"+c).on("updateAll"+c,function(){d.updateBreakpoints(b,e),d.updateCols(b,e)})),f.$container.length&&(e.columnSelector_mediaquery&&(f.$auto=a(e.columnSelector_layout.replace(/\{name\}/g,e.columnSelector_mediaqueryName)).prependTo(f.$container),f.$auto.find("input").add(f.$auto.filter("input")).attr("data-column","auto").prop("checked",f.auto).toggleClass(e.columnSelector_cssChecked,f.auto).on("change",function(){d.updateAuto(b,e,a(this))}).change()),b.$table.off("update"+c).on("update"+c,function(){d.updateCols(b,e)}))},updateAuto:function(c,e,f){var g=c.selector;g.auto=f.prop("checked")||!1,a.each(g.$checkbox,function(a,b){b&&(b[0].disabled=g.auto,g.$wrapper[a].toggleClass("disabled",g.auto))}),e.columnSelector_mediaquery&&d.updateBreakpoints(c,e),d.updateCols(c,e),c.selector.$popup&&c.selector.$popup.find(".tablesorter-column-selector").html(g.$container.html()).find("input").each(function(){var b=a(this).attr("data-column");a(this).prop("checked","auto"===b?g.auto:g.states[b])}),e.columnSelector_saveColumns&&b.storage&&b.storage(c.$table[0],"tablesorter-columnSelector-auto",{auto:g.auto}),g.auto&&c.$table.trigger(e.columnSelector_updated)},addSelectors:function(a,b){var c=[],d=" col:nth-child("+b+")";return c.push(a+d+","+a+"_extra_table"+d),d=" tr th:nth-child("+b+")",c.push(a+d+","+a+"_extra_table"+d),d=" tr td:nth-child("+b+")",c.push(a+d+","+a+"_extra_table"+d),c},updateBreakpoints:function(c,e){var f,g,h,i,j=[],k=c.selector,l=c.namespace+"columnselector",m=[],n="";if(e.columnSelector_mediaquery&&!k.auto)return k.$breakpoints.prop("disabled",!0),void k.$style.prop("disabled",!1);if(e.columnSelector_mediaqueryHidden)for(h=0;hf;f++)i=[],c.$headers.filter("["+e.columnSelector_priority+"="+(f+1)+"]").each(function(){h=parseInt(a(this).attr("data-column"),10)+1,j[h]||(i=i.concat(d.addSelectors(l,h)))}),i.length&&(m=m.concat(i),n+=d.queryBreak.replace(/\[size\]/g,e.columnSelector_breakpoints[f]).replace(/\[columns\]/g,i.join(",")));k.$style&&k.$style.prop("disabled",!0),m.length&&k.$breakpoints.prop("disabled",!1).html(d.queryAll.replace(/\[columns\]/g,m.join(","))+n)},updateCols:function(c,e){if(!(e.columnSelector_mediaquery&&c.selector.auto||c.selector.isInitializing)){var f,g=c.selector,h=[],i=c.namespace+"columnselector";g.$container.find("input[data-column]").filter('[data-column!="auto"]').each(function(){this.checked||(f=parseInt(a(this).attr("data-column"),10)+1,h=h.concat(d.addSelectors(i,f))),a(this).toggleClass(e.columnSelector_cssChecked,this.checked)}),e.columnSelector_mediaquery&&g.$breakpoints.prop("disabled",!0),g.$style&&g.$style.prop("disabled",!1).html(h.length?h.join(",")+" { display: none; }":""),e.columnSelector_saveColumns&&b.storage&&b.storage(c.$table[0],"tablesorter-columnSelector",g.states),c.$table.trigger(e.columnSelector_updated)}},attachTo:function(b,c){b=a(b)[0];var d,e,f,g=b.config,h=a(c);h.length&&g&&(h.find(".tablesorter-column-selector").length||h.append(''),d=g.selector,e=g.widgetOptions,h.find(".tablesorter-column-selector").html(d.$container.html()).find("input").each(function(){var b=a(this).attr("data-column"),c="auto"===b?d.auto:d.states[b];a(this).toggleClass(e.columnSelector_cssChecked,c).prop("checked",c)}),d.$popup=h.on("change","input",function(){f=a(this).toggleClass(e.columnSelector_cssChecked,this.checked).attr("data-column"),d.$container.find('input[data-column="'+f+'"]').prop("checked",this.checked).trigger("change")}))}};b.addWidget({id:"columnSelector",priority:10,options:{columnSelector_container:null,columnSelector_columns:{},columnSelector_saveColumns:!0,columnSelector_layout:'',columnSelector_name:"data-selector-name",columnSelector_mediaquery:!0,columnSelector_mediaqueryName:"Auto: ",columnSelector_mediaqueryState:!0,columnSelector_mediaqueryHidden:!1,columnSelector_breakpoints:["20em","30em","40em","50em","60em","70em"],columnSelector_priority:"data-priority",columnSelector_cssChecked:"checked",columnSelector_updated:"columnUpdate"},init:function(a,b,c,e){d.init(a,c,e)},remove:function(a,b,d,e){if(!e){var f=b.selector;f.$container.empty(),f.$popup&&f.$popup.empty(),f.$style.remove(),f.$breakpoints.remove(),b.$table.off("updateAll"+c+" update"+c)}}})}(jQuery); \ No newline at end of file +!function(a){"use strict";var b=a.tablesorter,c=".tscolsel",d=b.columnSelector={queryAll:"@media only all { [columns] { display: none; } } ",queryBreak:"@media all and (min-width: [size]) { [columns] { display: table-cell; } } ",init:function(b,e,f){var g,h;return g=a(f.columnSelector_layout),g.find("input").add(g.filter("input")).length?(e.$table.addClass(e.namespace.slice(1)+"columnselector"),h=e.selector={$container:a(f.columnSelector_container||"
")},h.$style=a("").prop("disabled",!0).appendTo("head"),h.$breakpoints=a("").prop("disabled",!0).appendTo("head"),h.isInitializing=!0,d.setUpColspan(e,f),d.setupSelector(e,f),f.columnSelector_mediaquery&&d.setupBreakpoints(e,f),h.isInitializing=!1,h.$container.length?d.updateCols(e,f):e.debug&&console.warn("ColumnSelector: >> container not found"),void e.$table.off("refreshColumnSelector"+c).on("refreshColumnSelector"+c,function(a,b,c){d.refreshColumns(this.config,b,c)})):void(e.debug&&console.error("ColumnSelector: >> ERROR: Column Selector aborting, no input found in the layout! ***"))},refreshColumns:function(b,c,e){var f,g,h=a.isArray(e||c),i=b.widgetOptions;if("undefined"!=typeof c&&b.selector.$container.length){if("selectors"===c&&(b.selector.$container.empty(),d.setupSelector(b,i),d.setupBreakpoints(b,i),"undefined"==typeof e&&(e=b.selector.auto)),h)for(g=e||c,a.each(g,function(a,b){g[a]=parseInt(b,10)}),f=0;f=0);d.updateAuto(b,i,b.selector.$container.find('input[data-column="auto"]').prop("checked",e===!0||c===!0||"auto"===c&&e!==!1))}else d.updateBreakpoints(b,i),d.updateCols(b,i);d.adjustColspans(b,i)},setupSelector:function(c,e){var f,g,h=c.selector,i=h.$container,j=e.columnSelector_saveColumns&&b.storage,k=j?b.storage(c.table,"tablesorter-columnSelector"):[],l=j?b.storage(c.table,"tablesorter-columnSelector-auto"):{};for(h.auto=a.isEmptyObject(l)||"boolean"!==a.type(l.auto)?e.columnSelector_mediaqueryState:l.auto,h.states=[],h.$column=[],h.$wrapper=[],h.$checkbox=[],f=0;f0||"disable"===l||e.columnSelector_columns[o]&&"disable"===e.columnSelector_columns[o]||(h.states[o]=k&&"undefined"!=typeof k[o]?k[o]:"undefined"!=typeof e.columnSelector_columns[o]?e.columnSelector_columns[o]:"true"===l||"false"!==l,h.$column[o]=a(this),g=m.attr(e.columnSelector_name)||m.text(),i.length&&(h.$wrapper[o]=a(e.columnSelector_layout.replace(/\{name\}/g,g)).appendTo(i),h.$checkbox[o]=h.$wrapper[o].find("input").add(h.$wrapper[o].filter("input")).attr("data-column",o).toggleClass(e.columnSelector_cssChecked,h.states[o]).prop("checked",h.states[o]).on("change",function(){var b=a(this).attr("data-column");c.selector.states[b]=this.checked,d.updateCols(c,e)}).change()))}},setupBreakpoints:function(b,e){var f=b.selector;e.columnSelector_mediaquery&&(f.lastIndex=-1,d.updateBreakpoints(b,e),b.$table.off("updateAll"+c).on("updateAll"+c,function(){d.updateBreakpoints(b,e),d.updateCols(b,e)})),f.$container.length&&(e.columnSelector_mediaquery&&(f.$auto=a(e.columnSelector_layout.replace(/\{name\}/g,e.columnSelector_mediaqueryName)).prependTo(f.$container),f.$auto.find("input").add(f.$auto.filter("input")).attr("data-column","auto").prop("checked",f.auto).toggleClass(e.columnSelector_cssChecked,f.auto).on("change",function(){d.updateAuto(b,e,a(this))}).change()),b.$table.off("update"+c).on("update"+c,function(){d.updateCols(b,e)}))},updateAuto:function(c,e,f){var g=c.selector;g.auto=f.prop("checked")||!1,a.each(g.$checkbox,function(a,b){b&&(b[0].disabled=g.auto,g.$wrapper[a].toggleClass("disabled",g.auto))}),e.columnSelector_mediaquery&&d.updateBreakpoints(c,e),d.updateCols(c,e),c.selector.$popup&&c.selector.$popup.find(".tablesorter-column-selector").html(g.$container.html()).find("input").each(function(){var b=a(this).attr("data-column");a(this).prop("checked","auto"===b?g.auto:g.states[b])}),e.columnSelector_saveColumns&&b.storage&&b.storage(c.$table[0],"tablesorter-columnSelector-auto",{auto:g.auto}),d.adjustColspans(c,e),g.auto&&c.$table.trigger(e.columnSelector_updated)},addSelectors:function(a,b){var c=[],d=" col:nth-child("+b+")";return c.push(a+d+","+a+"_extra_table"+d),d=" tr th:nth-child("+b+")",c.push(a+d+","+a+"_extra_table"+d),d=" tr td:nth-child("+b+")",c.push(a+d+","+a+"_extra_table"+d),c},updateBreakpoints:function(c,e){var f,g,h,i,j=[],k=c.selector,l=c.namespace+"columnselector",m=[],n="";if(e.columnSelector_mediaquery&&!k.auto)return k.$breakpoints.prop("disabled",!0),void k.$style.prop("disabled",!1);if(e.columnSelector_mediaqueryHidden)for(h=0;hf;f++)i=[],c.$headers.filter("["+e.columnSelector_priority+"="+(f+1)+"]").each(function(){h=parseInt(a(this).attr("data-column"),10)+1,j[h]||(i=i.concat(d.addSelectors(l,h)))}),i.length&&(m=m.concat(i),n+=d.queryBreak.replace(/\[size\]/g,e.columnSelector_breakpoints[f]).replace(/\[columns\]/g,i.join(",")));k.$style&&k.$style.prop("disabled",!0),m.length&&k.$breakpoints.prop("disabled",!1).html(d.queryAll.replace(/\[columns\]/g,m.join(","))+n)},updateCols:function(c,e){if(!(e.columnSelector_mediaquery&&c.selector.auto||c.selector.isInitializing)){var f,g=c.selector,h=[],i=c.namespace+"columnselector";g.$container.find("input[data-column]").filter('[data-column!="auto"]').each(function(){this.checked||(f=parseInt(a(this).attr("data-column"),10)+1,h=h.concat(d.addSelectors(i,f))),a(this).toggleClass(e.columnSelector_cssChecked,this.checked)}),e.columnSelector_mediaquery&&g.$breakpoints.prop("disabled",!0),g.$style&&g.$style.prop("disabled",!1).html(h.length?h.join(",")+" { display: none; }":""),e.columnSelector_saveColumns&&b.storage&&b.storage(c.$table[0],"tablesorter-columnSelector",g.states),d.adjustColspans(c,e),c.$table.trigger(e.columnSelector_updated)}},setUpColspan:function(c,e){var f,g,h,i=!1,j=c.$table.add(a(c.namespace+"_extra_table")).children("thead, tfoot").children("tr").children("th, td"),k=j.length;for(f=0;k>f;f++)g=j[f].colSpan,g>1&&(i=!0,j.eq(f).addClass(c.namespace.slice(1)+"columnselectorHasSpan").attr("data-col-span",g));i&&e.columnSelector_mediaquery&&(h=c.namespace.slice(1)+"columnselector",a(window).off(h).on("resize"+h,b.window_resize).on("resizeEnd"+h,function(){$win.off("resize"+h,b.window_resize),d.adjustColspans(c,e),$win.on("resize"+h,b.window_resize)}))},adjustColspans:function(b,c){var d,e,f,g,h,i=b.selector,j=i.auto,k=a(b.namespace+"columnselectorHasSpan"),l=k.length;if(l)for(d=0;l>d;d++){for(f=parseInt(k.eq(d).attr("data-column"),10),g=parseInt(k.eq(d).attr("data-col-span"),10),h=f+g,e=f;h>e;e++)(!j&&i.states[e]===!1||j&&b.$headerIndexed[e]&&!b.$headerIndexed[e].is(":visible"))&&g--;g?k.eq(d).show()[0].colSpan=g:k.eq(d).hide()}},attachTo:function(b,c){b=a(b)[0];var d,e,f,g=b.config,h=a(c);h.length&&g&&(h.find(".tablesorter-column-selector").length||h.append(''),d=g.selector,e=g.widgetOptions,h.find(".tablesorter-column-selector").html(d.$container.html()).find("input").each(function(){var b=a(this).attr("data-column"),c="auto"===b?d.auto:d.states[b];a(this).toggleClass(e.columnSelector_cssChecked,c).prop("checked",c)}),d.$popup=h.on("change","input",function(){f=a(this).toggleClass(e.columnSelector_cssChecked,this.checked).attr("data-column"),d.$container.find('input[data-column="'+f+'"]').prop("checked",this.checked).trigger("change")}))}};b.window_resize=function(){b.timer_resize&&clearTimeout(b.timer_resize),b.timer_resize=setTimeout(function(){a(window).trigger("resizeEnd")},250)},b.addWidget({id:"columnSelector",priority:10,options:{columnSelector_container:null,columnSelector_columns:{},columnSelector_saveColumns:!0,columnSelector_layout:'',columnSelector_name:"data-selector-name",columnSelector_mediaquery:!0,columnSelector_mediaqueryName:"Auto: ",columnSelector_mediaqueryState:!0,columnSelector_mediaqueryHidden:!1,columnSelector_breakpoints:["20em","30em","40em","50em","60em","70em"],columnSelector_priority:"data-priority",columnSelector_cssChecked:"checked",columnSelector_updated:"columnUpdate"},init:function(a,b,c,e){d.init(a,c,e)},remove:function(a,b,d,e){if(!e){var f=b.selector;f.$container.empty(),f.$popup&&f.$popup.empty(),f.$style.remove(),f.$breakpoints.remove(),b.$table.off("updateAll"+c+" update"+c)}}})}(jQuery); \ No newline at end of file diff --git a/docs/example-widget-column-selector.html b/docs/example-widget-column-selector.html index f54ff06c..adad7bb2 100644 --- a/docs/example-widget-column-selector.html +++ b/docs/example-widget-column-selector.html @@ -175,7 +175,12 @@

Notes

    -
  • In v2.23.6, added columnSelector_mediaqueryHidden option.
  • +
  • In v2.23.6, +
      +
    • This widget now supports extra rows and colspan cells in the header & footer (not the body). The first demo has been updated to show this enhancement.
    • +
    • Added columnSelector_mediaqueryHidden option.
    • +
    +
  • In v2.23.2, added columnSelector_updated option.
  • In v2.23.0, updated methods to allow refreshing the content of the container & enchanced ability to set both auto and columns modes.
  • In v2.19.0, the refreshColumnSelector method has been updated to allow passing a parameter. Pass an array of zero-based column indexes of columns to show, or any non-array to enable auto mode (if available).
  • @@ -185,7 +190,7 @@
  • This widget will only work in tablesorter version 2.8+ and jQuery version 1.7+.
  • -
  • This widget may not work properly if the table contains rows with rowspan or colspan settings.
  • +
  • This widget may not work properly if the table body contains rows with rowspan or colspan settings.
  • The responsive part of this widget:
    • Uses similar parameters as those used by jQuery mobile to set column priority.
    • @@ -347,7 +352,7 @@ - When this option is set to true columns with a "columnSelector-false" class will be hidden while media queries ("auto" mode) are active. + When this option is set to true columns with a "columnSelector-false" class will be hidden while media queries ("auto" mode) are active (v2.23.6).

        @@ -523,6 +528,10 @@ $.tablesorter.columnSelector.refreshColumns( config, optionName, optionState );< + + + + @@ -538,6 +547,10 @@ $.tablesorter.columnSelector.refreshColumns( config, optionName, optionState );< + + + + diff --git a/docs/index.html b/docs/index.html index 9a541a29..d6e1059d 100644 --- a/docs/index.html +++ b/docs/index.html @@ -454,7 +454,7 @@
      • Beta Chart Widget (v2.19.0).
      • Columns highlight widget (v2.0.17)
      • -
      • Column selector widget (v2.15; v2.23.2).
      • +
      • Column selector widget (v2.15; v2.23.6).
      • Content editable widget (v2.9; v2.23.0).
      • Beta Dragtable mod - (jQuery UI widget for column reordering [ref]; v2.19.0).
      • Filter widget (v2.23.4): diff --git a/js/widgets/widget-columnSelector.js b/js/widgets/widget-columnSelector.js index b86116ae..59800b8a 100644 --- a/js/widgets/widget-columnSelector.js +++ b/js/widgets/widget-columnSelector.js @@ -35,6 +35,7 @@ colSel.$breakpoints = $('').prop('disabled', true).appendTo('head'); colSel.isInitializing = true; + tsColSel.setUpColspan(c, wo); tsColSel.setupSelector(c, wo); if (wo.columnSelector_mediaquery) { @@ -103,10 +104,11 @@ tsColSel.updateBreakpoints(c, wo); tsColSel.updateCols(c, wo); } + tsColSel.adjustColspans( c, wo ); }, setupSelector: function(c, wo) { - var name, + var index, name, colSel = c.selector, $container = colSel.$container, useStorage = wo.columnSelector_saveColumns && ts.storage, @@ -121,19 +123,19 @@ colSel.$wrapper = []; colSel.$checkbox = []; // populate the selector container - c.$table.children('thead').find('tr:first th', c.table).each(function() { - var $this = $(this), + for ( index = 0; index < c.columns; index++ ) { + var $header = c.$headerIndexed[ index ], // if no data-priority is assigned, default to 1, but don't remove it from the selector list - priority = $this.attr(wo.columnSelector_priority) || 1, - colId = $this.attr('data-column'), + priority = $header.attr(wo.columnSelector_priority) || 1, + colId = $header.attr('data-column'), col = ts.getColumnData( c.table, c.headers, colId ), - state = ts.getData(this, col, 'columnSelector'); + state = ts.getData( $header, col, 'columnSelector'); // if this column not hidable at all // include getData check (includes 'columnSelector-false' class, data attribute, etc) if ( isNaN(priority) && priority.length > 0 || state === 'disable' || ( wo.columnSelector_columns[colId] && wo.columnSelector_columns[colId] === 'disable') ) { - return true; // goto next + continue; // goto next } // set default state; storage takes priority @@ -143,7 +145,7 @@ colSel.$column[colId] = $(this); // set default col title - name = $this.attr(wo.columnSelector_name) || $this.text(); + name = $header.attr(wo.columnSelector_name) || $header.text(); if ($container.length) { colSel.$wrapper[colId] = $(wo.columnSelector_layout.replace(/\{name\}/g, name)).appendTo($container); colSel.$checkbox[colId] = colSel.$wrapper[colId] @@ -153,15 +155,17 @@ .toggleClass( wo.columnSelector_cssChecked, colSel.states[colId] ) .prop('checked', colSel.states[colId]) .on('change', function(){ - colSel.states[colId] = this.checked; + // ensure states is accurate + var colId = $(this).attr('data-column'); + c.selector.states[colId] = this.checked; tsColSel.updateCols(c, wo); }).change(); } - }); + } }, - setupBreakpoints: function(c, wo){ + setupBreakpoints: function(c, wo) { var colSel = c.selector; // add responsive breakpoints @@ -223,6 +227,7 @@ if (wo.columnSelector_saveColumns && ts.storage) { ts.storage( c.$table[0], 'tablesorter-columnSelector-auto', { auto : colSel.auto } ); } + tsColSel.adjustColspans( c, wo ); // trigger columnUpdate if auto is true (it gets skipped in updateCols() if (colSel.auto) { c.$table.trigger(wo.columnSelector_updated); @@ -312,9 +317,70 @@ if (wo.columnSelector_saveColumns && ts.storage) { ts.storage( c.$table[0], 'tablesorter-columnSelector', colSel.states ); } + tsColSel.adjustColspans( c, wo ); c.$table.trigger(wo.columnSelector_updated); }, + setUpColspan: function(c, wo) { + var index, span, nspace, + hasSpans = false, + $cells = c.$table + .add( $(c.namespace + '_extra_table') ) + .children('thead, tfoot') + .children('tr') + .children('th, td'), + len = $cells.length; + for ( index = 0; index < len; index++ ) { + span = $cells[ index ].colSpan; + if ( span > 1 ) { + hasSpans = true; + $cells.eq( index ) + .addClass( c.namespace.slice( 1 ) + 'columnselectorHasSpan' ) + .attr( 'data-col-span', span ); + } + } + // only add resize end if using media queries + if ( hasSpans && wo.columnSelector_mediaquery ) { + nspace = c.namespace.slice( 1 ) + 'columnselector'; + // Setup window.resizeEnd event + $( window ) + .off( nspace ) + .on( 'resize' + nspace, ts.window_resize ) + .on( 'resizeEnd' + nspace, function() { + // IE calls resize when you modify content, so we have to unbind the resize event + // so we don't end up with an infinite loop. we can rebind after we're done. + $win.off( 'resize' + nspace, ts.window_resize ); + tsColSel.adjustColspans( c, wo ); + $win.on( 'resize' + nspace, ts.window_resize ); + }); + } + }, + adjustColspans: function(c, wo) { + var index, cols, col, span, end, + colSel = c.selector, + autoModeOn = colSel.auto, + $colspans = $( c.namespace + 'columnselectorHasSpan' ), + len = $colspans.length; + if ( len ) { + for ( index = 0; index < len; index++ ) { + col = parseInt( $colspans.eq(index).attr('data-column'), 10 ); + span = parseInt( $colspans.eq(index).attr('data-col-span'), 10 ); + end = col + span; + for ( cols = col; cols < end; cols++ ) { + if ( !autoModeOn && colSel.states[ cols ] === false || + autoModeOn && c.$headerIndexed[ cols ] && !c.$headerIndexed[ cols ].is(':visible') ) { + span--; + } + } + if ( span ) { + $colspans.eq(index).show()[0].colSpan = span; + } else { + $colspans.eq(index).hide(); + } + } + } + }, + attachTo : function(table, elm) { table = $(table)[0]; var colSel, wo, indx, @@ -349,6 +415,16 @@ }; + /* Add window resizeEnd event (also used by scroller widget) */ + ts.window_resize = function() { + if ( ts.timer_resize ) { + clearTimeout( ts.timer_resize ); + } + ts.timer_resize = setTimeout( function() { + $( window ).trigger( 'resizeEnd' ); + }, 250 ); + }; + ts.addWidget({ id: 'columnSelector', priority: 10, diff --git a/js/widgets/widget-scroller.js b/js/widgets/widget-scroller.js index 823b040d..af761148 100644 --- a/js/widgets/widget-scroller.js +++ b/js/widgets/widget-scroller.js @@ -88,7 +88,7 @@ } }); - /* Add window resizeEnd event */ + /* Add window resizeEnd event (also used by columnSelector widget) */ ts.window_resize = function() { if ( ts.timer_resize ) { clearTimeout( ts.timer_resize );
      • StudentCourses
        Name
        NameMajorSexEnglishJapaneseCalculusGeometry
        StudentCourses
        Student03Languagesfemale85958085