mirror of
https://github.com/Mottie/tablesorter.git
synced 2025-01-12 15:24:21 +00:00
Added scroller widget
This commit is contained in:
Mottie
parent
ffafc9ea07
commit
97f657ac3b
221
docs/example-widget-scroller.html
Normal file
221
docs/example-widget-scroller.html
Normal file
@ -0,0 +1,221 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>jQuery plugin: Tablesorter 2.0 - Scroller Widget</title>
|
||||
|
||||
<!-- jQuery -->
|
||||
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.js"></script>
|
||||
|
||||
<!-- Demo stuff -->
|
||||
<link rel="stylesheet" href="css/jq.css">
|
||||
<link href="css/prettify.css" rel="stylesheet">
|
||||
<script src="js/prettify.js"></script>
|
||||
<script src="js/docs.js"></script>
|
||||
|
||||
<!-- Tablesorter: theme -->
|
||||
<link class="ui-theme" rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/cupertino/jquery-ui.css">
|
||||
<link class="ui-theme" rel="stylesheet" href="../css/theme.jui.css">
|
||||
<link class="theme" rel="stylesheet" href="../css/theme.default.css">
|
||||
<link class="theme" rel="stylesheet" href="../css/theme.blue.css">
|
||||
<link class="theme" rel="stylesheet" href="../css/theme.green.css">
|
||||
<link class="theme" rel="stylesheet" href="../css/theme.grey.css">
|
||||
<link class="theme" rel="stylesheet" href="../css/theme.ice.css">
|
||||
<link class="theme" rel="stylesheet" href="../css/theme.black-ice.css">
|
||||
<link class="theme" rel="stylesheet" href="../css/theme.dark.css">
|
||||
<link class="theme" rel="stylesheet" href="../css/theme.dropbox.css">
|
||||
|
||||
<!-- Tablesorter script: required -->
|
||||
<script src="../js/jquery.tablesorter.js"></script>
|
||||
<script src="../js/jquery.tablesorter.widgets.js"></script>
|
||||
<script src="../js/widgets/widget-scroller.js"></script>
|
||||
|
||||
<script id="js">$(function(){
|
||||
|
||||
$("table").tablesorter({
|
||||
widthFixed : true,
|
||||
showProcessing: true,
|
||||
headerTemplate : '{content} {icon}',
|
||||
widgets: [ 'uitheme', 'zebra', 'filter', 'scroller' ],
|
||||
widgetOptions : {
|
||||
scroller_height : 300,
|
||||
scroller_barWidth : 17,
|
||||
scroller_jumpToHeader: true,
|
||||
scroller_idPrefix : 's_'
|
||||
}
|
||||
});
|
||||
|
||||
});</script>
|
||||
<script>
|
||||
$(function() {
|
||||
$('link.theme').each(function(){ this.disabled = true; });
|
||||
|
||||
var b = true, $tbl,
|
||||
$c = $('#case'),
|
||||
themes = 'default blue green grey ice black-ice dark dropbox',
|
||||
i, o = '', t = themes.split(' ');
|
||||
for (i = 0; i < t.length; i++) {
|
||||
o += '<option>' + t[i] + '</option>';
|
||||
}
|
||||
|
||||
$('select')
|
||||
.append(o)
|
||||
.change(function(){
|
||||
var theme = $(this).val().toLowerCase(),
|
||||
files = $('link.theme, link.ui-theme'); // ui-theme is added by the themeswitcher
|
||||
files.each(function(){ this.disabled = true; });
|
||||
files.filter('[href*="' + (theme === 'jui' ? 'ui' : theme) + '"]').each(function(){ this.disabled = false; });
|
||||
$('table')
|
||||
.removeClass('tablesorter-' + t.join(' tablesorter-') + ' tablesorter-jui')
|
||||
.addClass('tablesorter-' + theme.replace(/-/,''));
|
||||
// make sure columns align
|
||||
$(window).trigger('resize');
|
||||
});
|
||||
|
||||
$tbl = $('.tablesorter-scroller-table table');
|
||||
$('button').click(function(){
|
||||
b = !b;
|
||||
$tbl.each(function(){
|
||||
this.config.widgetOptions.scroller_jumpToHeader = b;
|
||||
$c.html(b + '');
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div id="banner">
|
||||
<h1>table<em>sorter</em></h1>
|
||||
<h2>Scroller Widget</h2>
|
||||
<h3>Flexible client-side table sorting</h3>
|
||||
<a href="index.html">Back to documentation</a>
|
||||
</div>
|
||||
|
||||
<div id="main">
|
||||
|
||||
<p class="tip">
|
||||
<em>NOTE!</em>
|
||||
<ul>
|
||||
<li>This widget can not be applied to the original plugin and requires jQuery version 1.4+ to function properly; if you need to make it work with older versions of jQuery and the plugin, please use <a href="http://tconnell.com/samples/scroller/">this version</a> of the widget.</li>
|
||||
<li>This widget was originally written by <a href="http://tconnell.com/samples/scroller/">Connell & Associates, Inc.</a> and is dual-licensed under the MIT and GPL licenses. It has been modified to work with tablesorter version 2.9+.</li>
|
||||
<li>Scroller widget options include:
|
||||
<ul>
|
||||
<li><code>scroller_height</code> - Set the height of the scroll window in pixels (default is <code>300</code>.</li>
|
||||
<li><code>scroller_barWidth</code> - Set the width (default is <code>17</code>) of the scroll bar in pixels. This will need to be changed if using a custom scroll bar plugin.</li>
|
||||
<li><code>scroller_idPrefix</code> - This option contains a prefix string which is added to a random number. This id is then assigned to the wrapping scroll element. Modification is not necessary unless the prefix interferes with ID's already on your page.</li>
|
||||
<li><code>scroller_jumpToHeader</code> - When <code>true</code>, this option makes the table header jump into view when the table body is not scolled to the top and while scrolling up the page. It's not perfect, but it works. Disable it as desired.<br>
|
||||
<span class="remark">*</span> <em>To see the difference, toggle the button in the demo below, then scroll down & up the page using a mouse wheel with the cursor at the horizontal center of the page and about 100 pixels from the top, so the cursor is within the table body.</em></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</p>
|
||||
|
||||
<h1>Javascript</h1>
|
||||
<div id="javascript">
|
||||
<pre class="prettyprint lang-javascript"></pre>
|
||||
</div>
|
||||
|
||||
<h1>Demo</h1>
|
||||
Choose Theme:
|
||||
<select>
|
||||
<option value="jui">Jquery UI</option>
|
||||
</select><br>
|
||||
<br>
|
||||
<button>Toggle</button> scroller_jumpToHeader : <span id="case">true</span> (see the note above)<span class="remark">*</span>
|
||||
<br>
|
||||
|
||||
<table class="tablesorter">
|
||||
<thead>
|
||||
<tr><th>Name</th><th>Major</th><th>Sex</th><th>English</th><th>Japanese</th><th>Calculus</th><th class="filter-false sorter-false">Geometry</th></tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr><th>Name</th><th>Major</th><th>Sex</th><th>English</th><th>Japanese</th><th>Calculus</th><th>Geometry</th></tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
<tr><td>Student01</td><td>Languages</td><td>male</td><td>80</td><td>70</td><td>75</td><td>80</td></tr>
|
||||
<tr><td>Student02</td><td>Mathematics</td><td>male</td><td>90</td><td>88</td><td>100</td><td>90</td></tr>
|
||||
<tr><td>Student03</td><td>Languages</td><td>female</td><td>85</td><td>95</td><td>80</td><td>85</td></tr>
|
||||
<tr><td>Student04</td><td>Languages</td><td>male</td><td>60</td><td>55</td><td>100</td><td>100</td></tr>
|
||||
<tr><td>Student05</td><td>Languages</td><td>female</td><td>68</td><td>80</td><td>95</td><td>80</td></tr>
|
||||
<tr><td>Student06</td><td>Mathematics</td><td>male</td><td>100</td><td>99</td><td>100</td><td>90</td></tr>
|
||||
<tr><td>Student07</td><td>Mathematics</td><td>male</td><td>85</td><td>68</td><td>90</td><td>90</td></tr>
|
||||
<tr><td>Student08</td><td>Languages</td><td>male</td><td>100</td><td>90</td><td>90</td><td>85</td></tr>
|
||||
<tr><td>Student09</td><td>Mathematics</td><td>male</td><td>80</td><td>50</td><td>65</td><td>75</td></tr>
|
||||
<tr><td>Student10</td><td>Languages</td><td>male</td><td>85</td><td>100</td><td>100</td><td>90</td></tr>
|
||||
<tr><td>Student11</td><td>Languages</td><td>male</td><td>86</td><td>85</td><td>100</td><td>100</td></tr>
|
||||
<tr><td>Student12</td><td>Mathematics</td><td>female</td><td>100</td><td>75</td><td>70</td><td>85</td></tr>
|
||||
<tr><td>Student13</td><td>Languages</td><td>female</td><td>100</td><td>80</td><td>100</td><td>90</td></tr>
|
||||
<tr><td>Student14</td><td>Languages</td><td>female</td><td>50</td><td>45</td><td>55</td><td>90</td></tr>
|
||||
<tr><td>Student15</td><td>Languages</td><td>male</td><td>95</td><td>35</td><td>100</td><td>90</td></tr>
|
||||
<tr><td>Student16</td><td>Languages</td><td>female</td><td>100</td><td>50</td><td>30</td><td>70</td></tr>
|
||||
<tr><td>Student17</td><td>Languages</td><td>female</td><td>80</td><td>100</td><td>55</td><td>65</td></tr>
|
||||
<tr><td>Student18</td><td>Mathematics</td><td>male</td><td>30</td><td>49</td><td>55</td><td>75</td></tr>
|
||||
<tr><td>Student19</td><td>Languages</td><td>male</td><td>68</td><td>90</td><td>88</td><td>70</td></tr>
|
||||
<tr><td>Student20</td><td>Mathematics</td><td>male</td><td>40</td><td>45</td><td>40</td><td>80</td></tr>
|
||||
<tr><td>Student21</td><td>Languages</td><td>male</td><td>50</td><td>45</td><td>100</td><td>100</td></tr>
|
||||
<tr><td>Student22</td><td>Mathematics</td><td>male</td><td>100</td><td>99</td><td>100</td><td>90</td></tr>
|
||||
<tr><td>Student23</td><td>Languages</td><td>female</td><td>85</td><td>80</td><td>80</td><td>80</td></tr>
|
||||
<tr><td>student23</td><td>Mathematics</td><td>male</td><td>82</td><td>77</td><td>0</td><td>79</td></tr>
|
||||
<tr><td>student24</td><td>Languages</td><td>female</td><td>100</td><td>91</td><td>13</td><td>82</td></tr>
|
||||
<tr><td>student25</td><td>Mathematics</td><td>male</td><td>22</td><td>96</td><td>82</td><td>53</td></tr>
|
||||
<tr><td>student26</td><td>Languages</td><td>female</td><td>37</td><td>29</td><td>56</td><td>59</td></tr>
|
||||
<tr><td>student27</td><td>Mathematics</td><td>male</td><td>86</td><td>82</td><td>69</td><td>23</td></tr>
|
||||
<tr><td>student28</td><td>Languages</td><td>female</td><td>44</td><td>25</td><td>43</td><td>1</td></tr>
|
||||
<tr><td>student29</td><td>Mathematics</td><td>male</td><td>77</td><td>47</td><td>22</td><td>38</td></tr>
|
||||
<tr><td>student30</td><td>Languages</td><td>female</td><td>19</td><td>35</td><td>23</td><td>10</td></tr>
|
||||
<tr><td>student31</td><td>Mathematics</td><td>male</td><td>90</td><td>27</td><td>17</td><td>50</td></tr>
|
||||
<tr><td>student32</td><td>Languages</td><td>female</td><td>60</td><td>75</td><td>33</td><td>38</td></tr>
|
||||
<tr><td>student33</td><td>Mathematics</td><td>male</td><td>4</td><td>31</td><td>37</td><td>15</td></tr>
|
||||
<tr><td>student34</td><td>Languages</td><td>female</td><td>77</td><td>97</td><td>81</td><td>44</td></tr>
|
||||
<tr><td>student35</td><td>Mathematics</td><td>male</td><td>5</td><td>81</td><td>51</td><td>95</td></tr>
|
||||
<tr><td>student36</td><td>Languages</td><td>female</td><td>70</td><td>61</td><td>70</td><td>94</td></tr>
|
||||
<tr><td>student37</td><td>Mathematics</td><td>male</td><td>60</td><td>3</td><td>61</td><td>84</td></tr>
|
||||
<tr><td>student38</td><td>Languages</td><td>female</td><td>63</td><td>39</td><td>0</td><td>11</td></tr>
|
||||
<tr><td>student39</td><td>Mathematics</td><td>male</td><td>50</td><td>46</td><td>32</td><td>38</td></tr>
|
||||
<tr><td>student40</td><td>Languages</td><td>female</td><td>51</td><td>75</td><td>25</td><td>3</td></tr>
|
||||
<tr><td>student41</td><td>Mathematics</td><td>male</td><td>43</td><td>34</td><td>28</td><td>78</td></tr>
|
||||
<tr><td>student42</td><td>Languages</td><td>female</td><td>11</td><td>89</td><td>60</td><td>95</td></tr>
|
||||
<tr><td>student43</td><td>Mathematics</td><td>male</td><td>48</td><td>92</td><td>18</td><td>88</td></tr>
|
||||
<tr><td>student44</td><td>Languages</td><td>female</td><td>82</td><td>2</td><td>59</td><td>73</td></tr>
|
||||
<tr><td>student45</td><td>Mathematics</td><td>male</td><td>91</td><td>73</td><td>37</td><td>39</td></tr>
|
||||
<tr><td>student46</td><td>Languages</td><td>female</td><td>4</td><td>8</td><td>12</td><td>10</td></tr>
|
||||
<tr><td>student47</td><td>Mathematics</td><td>male</td><td>89</td><td>10</td><td>6</td><td>11</td></tr>
|
||||
<tr><td>student48</td><td>Languages</td><td>female</td><td>90</td><td>32</td><td>21</td><td>18</td></tr>
|
||||
<tr><td>student49</td><td>Mathematics</td><td>male</td><td>42</td><td>49</td><td>49</td><td>72</td></tr>
|
||||
<tr><td>student50</td><td>Languages</td><td>female</td><td>56</td><td>37</td><td>67</td><td>54</td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<div class="narrow-block">
|
||||
<table class="tablesorter">
|
||||
<thead>
|
||||
<tr><th>Account #</th><th>First Name</th><th>Last Name</th><th>Age</th><th>Total</th><th>Discount</th><th>Diff</th></tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr><td>A43</td><td>Peter</td><td>Parker</td><td>28</td><td>9.99</td><td>20.3%</td><td>+3</td></tr>
|
||||
<tr><td>A255</td><td>John</td><td>Hood</td><td>33</td><td>19.99</td><td>25.1%</td><td>-7</td></tr>
|
||||
<tr><td>A33</td><td>Clark</td><td>Kent</td><td>18</td><td>15.49</td><td>44.2%</td><td>-13</td></tr>
|
||||
<tr><td>A11</td><td>Bruce</td><td>Almighty</td><td>45</td><td>153.19</td><td>44%</td><td>+19</td></tr>
|
||||
<tr><td>A102</td><td>Bruce</td><td>Evans</td><td>56</td><td>153.19</td><td>23%</td><td>+9</td></tr>
|
||||
<tr><td>A23</td><td>Mike</td><td>Peters</td><td>22</td><td>5.69</td><td>20.3%</td><td>+2</td></tr>
|
||||
<tr><td>A55</td><td>Leslie</td><td>Kent</td><td>33</td><td>15.99</td><td>25.1%</td><td>-3</td></tr>
|
||||
<tr><td>A3</td><td>Frank</td><td>Mint</td><td>44</td><td>12.59</td><td>44.2%</td><td>-12</td></tr>
|
||||
<tr><td>A21</td><td>Joe</td><td>Thomas</td><td>45</td><td>15.25</td><td>44%</td><td>+12</td></tr>
|
||||
<tr><td>A12</td><td>Tess</td><td>Evans</td><td>66</td><td>13.59</td><td>23%</td><td>+4</td></tr>
|
||||
<tr><td>A21</td><td>Peter</td><td>Dunn</td><td>12</td><td>2.99</td><td>21.1%</td><td>+2</td></tr>
|
||||
<tr><td>A33</td><td>Harry</td><td>Jones</td><td>13</td><td>19.49</td><td>22.2%</td><td>-6</td></tr>
|
||||
<tr><td>A13</td><td>John</td><td>James</td><td>16</td><td>13.89</td><td>42.1%</td><td>-13</td></tr>
|
||||
<tr><td>A71</td><td>Nick</td><td>Parker</td><td>45</td><td>13.89</td><td>44%</td><td>+29</td></tr>
|
||||
<tr><td>A21</td><td>Charles</td><td>Dunn</td><td>19</td><td>15.49</td><td>22%</td><td>+3</td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div class="spacer"></div>
|
||||
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
240
js/widgets/widget-scroller.js
Normal file
240
js/widgets/widget-scroller.js
Normal file
@ -0,0 +1,240 @@
|
||||
/*!
|
||||
Copyright (C) 2011 T. Connell & Associates, Inc.
|
||||
|
||||
Dual-licensed under the MIT and GPL licenses
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
|
||||
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE
|
||||
FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
|
||||
WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
||||
|
||||
Resizable scroller widget for the jQuery tablesorter plugin
|
||||
|
||||
Version 2.0 - modified by Rob Garrison (4/4/2013)
|
||||
Requires jQuery, v1.2.3 or higher
|
||||
Requires the tablesorter plugin, v2.0 or higher, available at http://mottie.github.com/tablesorter/docs/
|
||||
|
||||
Usage:
|
||||
|
||||
$(function() {
|
||||
|
||||
$('table.tablesorter').tablesorter({
|
||||
widgets: ['zebra', 'scroller'],
|
||||
widgetOptions : {
|
||||
scroller_height : 300, // height of scroll window
|
||||
scroller_barWidth : 17, // scroll bar width
|
||||
scroller_jumpToHeader : true, // header snap to browser top when scrolling the tbody
|
||||
scroller_idPrefix : 's_' // cloned thead id prefix (random number added to end)
|
||||
}
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
Website: www.tconnell.com
|
||||
*/
|
||||
/*jshint browser:true, jquery:true, unused:false */
|
||||
;(function($){
|
||||
"use strict";
|
||||
|
||||
$.fn.hasScrollBar = function(){
|
||||
return this.get(0).scrollHeight > this.height();
|
||||
};
|
||||
|
||||
$.tablesorter.window_resize = function(){
|
||||
if (this.resize_timer) {
|
||||
clearTimeout(this.resize_timer);
|
||||
}
|
||||
this.resize_timer = setTimeout(function(){
|
||||
$(this).trigger('resizeEnd');
|
||||
}, 250);
|
||||
};
|
||||
|
||||
// Add extra scroller css
|
||||
$(function(){
|
||||
var s = '<style>' +
|
||||
'.tablesorter-scroller-header table.tablesorter { margin-bottom: 0; }' +
|
||||
'.tablesorter-scroller-table table.tablesorter { margin-top: 0; } ' +
|
||||
'.tablesorter-scroller-table .tablesorter-filter-row, .tablesorter-scroller-table tfoot { display: none; }' +
|
||||
'.tablesorter-scroller-table table.tablesorter thead tr.tablesorter-headerRow * {' +
|
||||
'line-height:0;height:0;border:none;background-image:none;padding-top:0;padding-bottom:0;margin-top:0;margin-bottom:0;overflow:hidden;' +
|
||||
'}</style>';
|
||||
$(s).appendTo('body');
|
||||
});
|
||||
|
||||
$.tablesorter.addWidget({
|
||||
id: 'scroller',
|
||||
priority: 60, // run after the filter widget
|
||||
options: {
|
||||
scroller_height : 300,
|
||||
scroller_barWidth : 17,
|
||||
scroller_jumpToHeader: true,
|
||||
scroller_idPrefix : 's_'
|
||||
},
|
||||
init: function(table, thisWidget, c, wo){
|
||||
var $win = $(window);
|
||||
//Setup window.resizeEnd event
|
||||
$win
|
||||
.bind('resize', $.tablesorter.window_resize)
|
||||
.bind('resizeEnd', function(e) {
|
||||
// init is run before format, so scroller_resizeWidth
|
||||
// won't be defined within the "c" or "wo" parameters
|
||||
if (typeof table.config.widgetOptions.scroller_resizeWidth === '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.unbind('resize', $.tablesorter.window_resize);
|
||||
table.config.widgetOptions.scroller_resizeWidth();
|
||||
$win.bind('resize', $.tablesorter.window_resize);
|
||||
}
|
||||
});
|
||||
},
|
||||
format: function(table, c, wo) {
|
||||
var h, $hdr, id, t, resize, $cells,
|
||||
$win = $(window),
|
||||
$tbl = c.$table,
|
||||
flag = false,
|
||||
filterInputs = 'input, select';
|
||||
|
||||
if (!c.isScrolling) {
|
||||
h = wo.scroller_height || 300;
|
||||
t = $tbl.find('tbody').height();
|
||||
if (t !== 0 && h > t) { h = t + 10; } // Table is less than h px
|
||||
id = wo.scroller_id = wo.scroller_idPrefix + Math.floor(Math.random() * 101);
|
||||
|
||||
$hdr = $('<table class="' + $tbl.attr('class') + '" cellpadding=0 cellspacing=0><thead>' + $tbl.find('thead:first').html() + '</thead></table>');
|
||||
$tbl
|
||||
.wrap('<div id="' + id + '" class="tablesorter-scroller" style="text-align:left;" />')
|
||||
.before($hdr)
|
||||
.find('.tablesorter-filter-row').addClass('hideme');
|
||||
|
||||
$cells = $hdr
|
||||
.wrap('<div class="tablesorter-scroller-header" style="width:' + $tbl.width() + ';" />')
|
||||
.find('.' + c.cssHeader)
|
||||
.bind('mousedown', function(){
|
||||
this.onselectstart = function(){ return false; };
|
||||
return false;
|
||||
});
|
||||
|
||||
$tbl
|
||||
.wrap('<div class="tablesorter-scroller-table" style="height:' + h + 'px;width:' + $tbl.width() + ';overflow-y:scroll;" />')
|
||||
.unbind('sortEnd.tsScroller')
|
||||
.bind('sortEnd.tsScroller', function(){
|
||||
c.$headers.each(function(i){
|
||||
var t = $cells.eq(i);
|
||||
t
|
||||
.attr('class', $(this).attr('class'))
|
||||
// remove processing icon
|
||||
.removeClass(c.cssProcessing);
|
||||
if (c.cssIcon){
|
||||
t
|
||||
.find('.' + c.cssIcon)
|
||||
.attr('class', $(this).find('.' + c.cssIcon).attr('class'));
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
// make scroller header sortable
|
||||
c.$headers.find('*')[ $.fn.addBack ? 'addBack': 'andSelf' ]().filter(c.selectorSort).each(function(i){
|
||||
var t = $(this);
|
||||
$cells.eq(i)
|
||||
// clicking on new header will trigger a sort
|
||||
.bind('mouseup', function(e){
|
||||
t.trigger(e, true); // external mouseup flag (click timer is ignored)
|
||||
})
|
||||
// prevent header text selection
|
||||
.bind('mousedown', function(){
|
||||
this.onselectstart = function(){ return false; };
|
||||
return false;
|
||||
});
|
||||
});
|
||||
|
||||
// look for filter widget
|
||||
$tbl.bind('filterEnd', function(){
|
||||
if (flag) { return; }
|
||||
$cells.each(function(i){
|
||||
$(this).find(filterInputs).val( c.$filters.find(filterInputs).eq(i).val() );
|
||||
});
|
||||
});
|
||||
$hdr.find(filterInputs).bind('keyup search', function(e){
|
||||
// ignore arrow and meta keys; allow backspace
|
||||
if ((e.which < 32 && e.which !== 8) || (e.which >= 37 && e.which <=40)) { return; }
|
||||
flag = true;
|
||||
var $f = $(this), col = $f.attr('data-column');
|
||||
c.$filters.find(filterInputs).eq(col)
|
||||
.val( $f.val() )
|
||||
.trigger('search');
|
||||
setTimeout(function(){
|
||||
flag = false;
|
||||
}, wo.filter_searchDelay);
|
||||
});
|
||||
|
||||
resize = function(){
|
||||
var d,
|
||||
//Hide other scrollers so we can resize
|
||||
$div = $('div.scroller[id != "' + id + '"]').hide();
|
||||
|
||||
$tbl.find('thead').show();
|
||||
|
||||
//Reset sizes so parent can resize.
|
||||
$hdr
|
||||
.width(0)
|
||||
.parent().width(0)
|
||||
.find('th,td').width(0);
|
||||
|
||||
$tbl
|
||||
.width(0)
|
||||
.find('thead').find('th,td').width(0);
|
||||
d = $tbl.parent();
|
||||
d.width(0);
|
||||
|
||||
d.parent().trigger('resize');
|
||||
// Shrink a bit to accommodate scrollbar
|
||||
d.width( d.parent().innerWidth() - ( d.parent().hasScrollBar() ? wo.scroller_barWidth : 0 ) );
|
||||
|
||||
$tbl.width( d.innerWidth() - ( d.hasScrollBar() ? wo.scroller_barWidth : 0 ) );
|
||||
$tbl.find('thead').find('th,td').filter(':visible').each(function(i, c){
|
||||
var $th = $(c),
|
||||
//Wrap in browser detect??
|
||||
w = parseInt( $th.css('min-width').replace('auto', '0').replace(/(px|em)/, ''), 10 );
|
||||
if ( $th.width() < w ) {
|
||||
$th.width(w);
|
||||
} else {
|
||||
w = $th.width();
|
||||
}
|
||||
$hdr.find('th,td').eq(i).width(w);
|
||||
});
|
||||
|
||||
$hdr.width($tbl.innerWidth());
|
||||
$div.show();
|
||||
};
|
||||
|
||||
//Expose to external calls
|
||||
wo.scroller_resizeWidth = resize;
|
||||
|
||||
resize();
|
||||
|
||||
$tbl.find('thead').css('visibility', 'hidden');
|
||||
c.isScrolling = true;
|
||||
|
||||
t = $tbl.parent().parent().height();
|
||||
// The header will always jump into view if scrolling the table body
|
||||
$tbl.parent().bind('scroll', function(){
|
||||
if (wo.scroller_jumpToHeader) {
|
||||
var pos = $win.scrollTop() - $hdr.offset().top;
|
||||
if ($(this).scrollTop() !== 0 && pos < t && pos > 0) {
|
||||
$win.scrollTop( $hdr.offset().top );
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
//Sorting, so scroll to top
|
||||
$tbl.parent().animate({ scrollTop: 0 }, 'fast');
|
||||
|
||||
},
|
||||
remove : function(table, c, wo){
|
||||
|
||||
}
|
||||
});
|
||||
|
||||
})(jQuery);
|
||||
@ -45,8 +45,10 @@
|
||||
************************************************/
|
||||
// Run JSHint on main js files
|
||||
tester.jsHintTest('JSHint core', 'js/jquery.tablesorter.js');
|
||||
tester.jsHintTest('JSHint widgets', 'js/jquery.tablesorter.widgets.js');
|
||||
tester.jsHintTest('JSHint pager', 'addons/pager/jquery.tablesorter.pager.js');
|
||||
tester.jsHintTest('JSHint widgets', 'js/jquery.tablesorter.widgets.js');
|
||||
tester.jsHintTest('JSHint group widget', 'js/widgets/widget-grouping.js');
|
||||
tester.jsHintTest('JSHint scroller widget', 'js/widgets/widget-scroller.js');
|
||||
|
||||
/************************************************
|
||||
Initialization
|
||||
|
||||
Loading…
Reference in New Issue
Block a user