mirror of
https://github.com/koalyptus/TableFilter.git
synced 2024-06-15 20:25:07 +02:00
1041 lines
24 KiB
HTML
1041 lines
24 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<title>Grid layout with custom styles | TableFilter</title>
|
|
|
|
<!-- Bootstrap core CSS -->
|
|
<link rel="stylesheet" href="assets/css/bootstrap.min.css">
|
|
|
|
<!-- Bootstrap theme -->
|
|
<link href="assets/css/bootstrap-theme.min.css" rel="stylesheet">
|
|
|
|
<!-- Custom styles for this template -->
|
|
<link href="assets/css/theme.css" rel="stylesheet">
|
|
|
|
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
|
|
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
|
|
<!--[if lt IE 9]>
|
|
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
|
|
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
|
|
<![endif]-->
|
|
</head>
|
|
<body>
|
|
|
|
|
|
<!-- Fixed navbar -->
|
|
<div class="navbar navbar-inverse navbar-fixed-top" role="navigation">
|
|
<div class="container">
|
|
<div class="navbar-header">
|
|
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
|
|
<span class="sr-only">Toggle navigation</span>
|
|
<span class="icon-bar"></span>
|
|
<span class="icon-bar"></span>
|
|
<span class="icon-bar"></span>
|
|
</button>
|
|
<a class="navbar-brand" href="./">TableFilter</a>
|
|
</div>
|
|
<div class="navbar-collapse collapse">
|
|
<ul class="nav navbar-nav">
|
|
<!-- you can exclude pages using {{#isnt}} helper: {{#isnt data.title 'Blog'}} -->
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li>
|
|
<a href="examples.html">Examples</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</ul>
|
|
|
|
<ul class="nav navbar-nav navbar-right">
|
|
<li class="dropdown">
|
|
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Github <b class="caret"></b></a>
|
|
<ul class="dropdown-menu">
|
|
<li>
|
|
<a href="https://github.com/koalyptus/TableFilter">Repo</a>
|
|
</li>
|
|
<li>
|
|
<a href="https://github.com/koalyptus/TableFilter/wiki">Wiki</a>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
<li>
|
|
<a href="./docs" target="_blank">Docs</a>
|
|
</li>
|
|
</ul>
|
|
</div><!--/.nav-collapse -->
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<div class="container theme-showcase" role="main">
|
|
|
|
|
|
<div data-config>
|
|
<link rel="stylesheet" type="text/css" href="tablefilter/style/tablefilter.css">
|
|
</div>
|
|
|
|
<h1>Grid layout with custom styles</h1>
|
|
|
|
<p>
|
|
This demos shows how to use some of the CSS options to customise a
|
|
<code>grid_layout</code> table type.
|
|
</p>
|
|
|
|
|
|
<table id="demo" class="dummy">
|
|
<thead>
|
|
<tr>
|
|
<th>Email</th>
|
|
<th>Id</th>
|
|
<th>Phone</th>
|
|
<th>Total</th>
|
|
<th>Url</th>
|
|
<th>ISO Date</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td>found@mountdev.net</td>
|
|
<td>03519</td>
|
|
<td>941-964-1599</td>
|
|
<td>$1176.48</td>
|
|
<td>http://donuts.com</td>
|
|
<td>2000/8/6</td>
|
|
</tr>
|
|
<tr>
|
|
<td>lost@fish.org</td>
|
|
<td>36628</td>
|
|
<td>941-964-5975</td>
|
|
<td>$822.23</td>
|
|
<td>http://www.gmail.com</td>
|
|
<td>1994/7/14</td>
|
|
</tr>
|
|
<tr>
|
|
<td>mendez@dotnet.ca</td>
|
|
<td>90442</td>
|
|
<td>941-964-1649</td>
|
|
<td>$1985.72</td>
|
|
<td>http://reno.gov</td>
|
|
<td>1997/10/20</td>
|
|
</tr>
|
|
<tr>
|
|
<td>carl@donuts.com</td>
|
|
<td>00412</td>
|
|
<td>941-964-6432</td>
|
|
<td>$1834.77</td>
|
|
<td>http://gmail.com</td>
|
|
<td>1998/8/23</td>
|
|
</tr>
|
|
<tr>
|
|
<td>foo@fish.org</td>
|
|
<td>80653</td>
|
|
<td>941-964-1022</td>
|
|
<td>$260.26</td>
|
|
<td>http://samba.org</td>
|
|
<td>1991/11/24</td>
|
|
</tr>
|
|
<tr>
|
|
<td>found@fish.org</td>
|
|
<td>54635</td>
|
|
<td>941-964-6439</td>
|
|
<td>$1442.80</td>
|
|
<td>http://dotnet.ca</td>
|
|
<td>1987/7/12</td>
|
|
</tr>
|
|
<tr>
|
|
<td>found@flexomat.com</td>
|
|
<td>20953</td>
|
|
<td>941-964-5544</td>
|
|
<td>$575.42</td>
|
|
<td>http://gmail.com</td>
|
|
<td>1988/6/10</td>
|
|
</tr>
|
|
<tr>
|
|
<td>lost@aftonbladet.se</td>
|
|
<td>60810</td>
|
|
<td>941-964-8406</td>
|
|
<td>$1054.39</td>
|
|
<td>http://www.samba.org</td>
|
|
<td>1988/5/18</td>
|
|
</tr>
|
|
<tr>
|
|
<td>carl@reno.gov</td>
|
|
<td>22666</td>
|
|
<td>941-964-104</td>
|
|
<td>$373.59</td>
|
|
<td>http://www.lostnfound.org</td>
|
|
<td>1981/11/5</td>
|
|
</tr>
|
|
<tr>
|
|
<td>carl@donuts.com</td>
|
|
<td>82867</td>
|
|
<td>941-964-1031</td>
|
|
<td>$631.03</td>
|
|
<td>http://www.reno.gov</td>
|
|
<td>1985/1/22</td>
|
|
</tr>
|
|
<tr>
|
|
<td>foo@donuts.com</td>
|
|
<td>11268</td>
|
|
<td>941-964-208</td>
|
|
<td>$3730.64</td>
|
|
<td>http://aftonbladet.se</td>
|
|
<td>1989/8/4</td>
|
|
</tr>
|
|
<tr>
|
|
<td>devo@google.se</td>
|
|
<td>17059</td>
|
|
<td>941-964-2903</td>
|
|
<td>$1404.67</td>
|
|
<td>http://www.gmail.com</td>
|
|
<td>1983/4/28</td>
|
|
</tr>
|
|
<tr>
|
|
<td>muffins@flexomat.com</td>
|
|
<td>90584</td>
|
|
<td>941-964-4640</td>
|
|
<td>$3706.01</td>
|
|
<td>http://www.fish.org</td>
|
|
<td>1997/4/8</td>
|
|
</tr>
|
|
<tr>
|
|
<td>foo@samba.org</td>
|
|
<td>82966</td>
|
|
<td>941-964-7245</td>
|
|
<td>$1001.38</td>
|
|
<td>http://www.reno.gov</td>
|
|
<td>1995/11/1</td>
|
|
</tr>
|
|
<tr>
|
|
<td>foo@reno.gov</td>
|
|
<td>03603</td>
|
|
<td>941-964-8942</td>
|
|
<td>$1677.07</td>
|
|
<td>http://www.flexomat.com</td>
|
|
<td>1980/7/31</td>
|
|
</tr>
|
|
<tr>
|
|
<td>found@flexomat.com</td>
|
|
<td>84939</td>
|
|
<td>941-964-7004</td>
|
|
<td>$3916.83</td>
|
|
<td>http://www.fish.org</td>
|
|
<td>1980/8/26</td>
|
|
</tr>
|
|
<tr>
|
|
<td>henry@lostnfound.org</td>
|
|
<td>76453</td>
|
|
<td>941-964-3084</td>
|
|
<td>$3875.88</td>
|
|
<td>http://www.fish.org</td>
|
|
<td>2000/10/22</td>
|
|
</tr>
|
|
<tr>
|
|
<td>sam@aftonbladet.se</td>
|
|
<td>36274</td>
|
|
<td>941-964-7784</td>
|
|
<td>$73.43</td>
|
|
<td>http://www.dn.se</td>
|
|
<td>1994/11/11</td>
|
|
</tr>
|
|
<tr>
|
|
<td>dev@polyester.se</td>
|
|
<td>15971</td>
|
|
<td>941-964-7527</td>
|
|
<td>$1855.18</td>
|
|
<td>http://www.flexomat.com</td>
|
|
<td>1984/8/16</td>
|
|
</tr>
|
|
<tr>
|
|
<td>devo@fish.org</td>
|
|
<td>31734</td>
|
|
<td>941-964-9760</td>
|
|
<td>$3201.35</td>
|
|
<td>http://www.samba.org</td>
|
|
<td>1989/3/4</td>
|
|
</tr>
|
|
<tr>
|
|
<td>devo@reno.gov</td>
|
|
<td>52074</td>
|
|
<td>941-964-2068</td>
|
|
<td>$3035.24</td>
|
|
<td>http://www.dn.se</td>
|
|
<td>1998/2/24</td>
|
|
</tr>
|
|
<tr>
|
|
<td>mendez@fish.org</td>
|
|
<td>87800</td>
|
|
<td>941-964-7933</td>
|
|
<td>$618.59</td>
|
|
<td>http://www.dn.se</td>
|
|
<td>1989/5/28</td>
|
|
</tr>
|
|
<tr>
|
|
<td>muffins@reno.gov</td>
|
|
<td>95926</td>
|
|
<td>941-964-147</td>
|
|
<td>$3897.91</td>
|
|
<td>http://www.flexomat.com</td>
|
|
<td>2003/4/1</td>
|
|
</tr>
|
|
<tr>
|
|
<td>carl@donuts.com</td>
|
|
<td>74513</td>
|
|
<td>941-964-4507</td>
|
|
<td>$2150.68</td>
|
|
<td>http://www.fish.org</td>
|
|
<td>1987/4/8</td>
|
|
</tr>
|
|
<tr>
|
|
<td>sam@fish.org</td>
|
|
<td>82420</td>
|
|
<td>941-964-2134</td>
|
|
<td>$3947.54</td>
|
|
<td>http://mountdev.net</td>
|
|
<td>1990/11/26</td>
|
|
</tr>
|
|
<tr>
|
|
<td>devo@mountdev.net</td>
|
|
<td>81905</td>
|
|
<td>941-964-3535</td>
|
|
<td>$722.17</td>
|
|
<td>http://fish.org</td>
|
|
<td>1985/12/28</td>
|
|
</tr>
|
|
<tr>
|
|
<td>john@lostnfound.org</td>
|
|
<td>93124</td>
|
|
<td>941-964-1508</td>
|
|
<td>$394.82</td>
|
|
<td>http://www.mountdev.net</td>
|
|
<td>1989/12/10</td>
|
|
</tr>
|
|
<tr>
|
|
<td>adam@google.se</td>
|
|
<td>51938</td>
|
|
<td>941-964-5533</td>
|
|
<td>$3519.06</td>
|
|
<td>http://dotnet.ca</td>
|
|
<td>1986/6/27</td>
|
|
</tr>
|
|
<tr>
|
|
<td>carl@lostnfound.org</td>
|
|
<td>51270</td>
|
|
<td>941-964-805</td>
|
|
<td>$2101.59</td>
|
|
<td>http://flexomat.com</td>
|
|
<td>1987/10/25</td>
|
|
</tr>
|
|
<tr>
|
|
<td>muffins@dotnet.ca</td>
|
|
<td>44995</td>
|
|
<td>941-964-8299</td>
|
|
<td>$1708.57</td>
|
|
<td>http://fish.org</td>
|
|
<td>1987/9/24</td>
|
|
</tr>
|
|
<tr>
|
|
<td>adam@samba.org</td>
|
|
<td>04065</td>
|
|
<td>941-964-8643</td>
|
|
<td>$1461.31</td>
|
|
<td>http://polyester.se</td>
|
|
<td>1993/9/13</td>
|
|
</tr>
|
|
<tr>
|
|
<td>carl@donuts.com</td>
|
|
<td>01801</td>
|
|
<td>941-964-1839</td>
|
|
<td>$2434.33</td>
|
|
<td>http://www.google.se</td>
|
|
<td>1987/7/8</td>
|
|
</tr>
|
|
<tr>
|
|
<td>muffins@mountdev.net</td>
|
|
<td>49570</td>
|
|
<td>941-964-877</td>
|
|
<td>$3273.22</td>
|
|
<td>http://polyester.se</td>
|
|
<td>2000/4/23</td>
|
|
</tr>
|
|
<tr>
|
|
<td>dev@google.se</td>
|
|
<td>31947</td>
|
|
<td>941-964-3956</td>
|
|
<td>$1647.20</td>
|
|
<td>http://www.dn.se</td>
|
|
<td>2006/9/25</td>
|
|
</tr>
|
|
<tr>
|
|
<td>christian@fish.org</td>
|
|
<td>05775</td>
|
|
<td>941-964-9882</td>
|
|
<td>$3203.96</td>
|
|
<td>http://flexomat.com</td>
|
|
<td>1981/5/3</td>
|
|
</tr>
|
|
<tr>
|
|
<td>henry@mountdev.net</td>
|
|
<td>18946</td>
|
|
<td>941-964-5204</td>
|
|
<td>$3281.09</td>
|
|
<td>http://www.lostnfound.org</td>
|
|
<td>1989/9/29</td>
|
|
</tr>
|
|
<tr>
|
|
<td>carl@mountdev.net</td>
|
|
<td>39096</td>
|
|
<td>941-964-5708</td>
|
|
<td>$1788.11</td>
|
|
<td>http://www.samba.org</td>
|
|
<td>1983/2/7</td>
|
|
</tr>
|
|
<tr>
|
|
<td>sam@dn.se</td>
|
|
<td>45043</td>
|
|
<td>941-964-7175</td>
|
|
<td>$1254.08</td>
|
|
<td>http://google.se</td>
|
|
<td>1981/3/30</td>
|
|
</tr>
|
|
<tr>
|
|
<td>henry@dotnet.ca</td>
|
|
<td>41456</td>
|
|
<td>941-964-4812</td>
|
|
<td>$1779.17</td>
|
|
<td>http://mountdev.net</td>
|
|
<td>1980/9/11</td>
|
|
</tr>
|
|
<tr>
|
|
<td>christian@polyester.se</td>
|
|
<td>78584</td>
|
|
<td>941-964-6967</td>
|
|
<td>$3956.45</td>
|
|
<td>http://www.reno.gov</td>
|
|
<td>1982/7/24</td>
|
|
</tr>
|
|
<tr>
|
|
<td>muffins@flexomat.com</td>
|
|
<td>56098</td>
|
|
<td>941-964-9399</td>
|
|
<td>$558.88</td>
|
|
<td>http://www.fish.org</td>
|
|
<td>1981/3/1</td>
|
|
</tr>
|
|
<tr>
|
|
<td>muffins@gmail.com</td>
|
|
<td>92303</td>
|
|
<td>941-964-1958</td>
|
|
<td>$1094.38</td>
|
|
<td>http://www.fish.org</td>
|
|
<td>1983/1/10</td>
|
|
</tr>
|
|
<tr>
|
|
<td>christian@mountdev.net</td>
|
|
<td>96564</td>
|
|
<td>941-964-3947</td>
|
|
<td>$3593.94</td>
|
|
<td>http://www.dn.se</td>
|
|
<td>2004/11/26</td>
|
|
</tr>
|
|
<tr>
|
|
<td>lost@polyester.se</td>
|
|
<td>53352</td>
|
|
<td>941-964-7300</td>
|
|
<td>$1548.49</td>
|
|
<td>http://www.mountdev.net</td>
|
|
<td>1989/7/22</td>
|
|
</tr>
|
|
<tr>
|
|
<td>adam@flexomat.com</td>
|
|
<td>17411</td>
|
|
<td>941-964-6808</td>
|
|
<td>$3744.57</td>
|
|
<td>http://www.lostnfound.org</td>
|
|
<td>1998/4/17</td>
|
|
</tr>
|
|
<tr>
|
|
<td>john@gmail.com</td>
|
|
<td>55140</td>
|
|
<td>941-964-5592</td>
|
|
<td>$641.84</td>
|
|
<td>http://www.dn.se</td>
|
|
<td>1989/12/15</td>
|
|
</tr>
|
|
<tr>
|
|
<td>foo@google.se</td>
|
|
<td>19355</td>
|
|
<td>941-964-5290</td>
|
|
<td>$3053.28</td>
|
|
<td>http://donuts.com</td>
|
|
<td>1987/6/25</td>
|
|
</tr>
|
|
<tr>
|
|
<td>dev@dn.se</td>
|
|
<td>38729</td>
|
|
<td>941-964-1565</td>
|
|
<td>$1539.30</td>
|
|
<td>http://www.flexomat.com</td>
|
|
<td>1989/3/13</td>
|
|
</tr>
|
|
<tr>
|
|
<td>mendez@dn.se</td>
|
|
<td>22531</td>
|
|
<td>941-964-4285</td>
|
|
<td>$18.39</td>
|
|
<td>http://google.se</td>
|
|
<td>1996/8/19</td>
|
|
</tr>
|
|
<tr>
|
|
<td>found@mountdev.net</td>
|
|
<td>03979</td>
|
|
<td>941-964-3119</td>
|
|
<td>$2961.55</td>
|
|
<td>http://www.dotnet.ca</td>
|
|
<td>2005/5/27</td>
|
|
</tr>
|
|
<tr>
|
|
<td>foo@reno.gov</td>
|
|
<td>59240</td>
|
|
<td>941-964-3593</td>
|
|
<td>$3039.37</td>
|
|
<td>http://www.lostnfound.org</td>
|
|
<td>2005/8/27</td>
|
|
</tr>
|
|
<tr>
|
|
<td>dev@polyester.se</td>
|
|
<td>53160</td>
|
|
<td>941-964-8179</td>
|
|
<td>$468.97</td>
|
|
<td>http://www.samba.org</td>
|
|
<td>1988/10/23</td>
|
|
</tr>
|
|
<tr>
|
|
<td>christian@reno.gov</td>
|
|
<td>96671</td>
|
|
<td>941-964-99</td>
|
|
<td>$994.56</td>
|
|
<td>http://gmail.com</td>
|
|
<td>1984/4/22</td>
|
|
</tr>
|
|
<tr>
|
|
<td>christian@gmail.com</td>
|
|
<td>60247</td>
|
|
<td>941-964-341</td>
|
|
<td>$1358.07</td>
|
|
<td>http://www.donuts.com</td>
|
|
<td>1987/11/20</td>
|
|
</tr>
|
|
<tr>
|
|
<td>lost@dotnet.ca</td>
|
|
<td>92437</td>
|
|
<td>941-964-6495</td>
|
|
<td>$3384.20</td>
|
|
<td>http://mountdev.net</td>
|
|
<td>1982/10/14</td>
|
|
</tr>
|
|
<tr>
|
|
<td>dev@flexomat.com</td>
|
|
<td>08314</td>
|
|
<td>941-964-5549</td>
|
|
<td>$223.00</td>
|
|
<td>http://flexomat.com</td>
|
|
<td>1985/12/6</td>
|
|
</tr>
|
|
<tr>
|
|
<td>henry@lostnfound.org</td>
|
|
<td>46306</td>
|
|
<td>941-964-8496</td>
|
|
<td>$3170.19</td>
|
|
<td>http://www.dotnet.ca</td>
|
|
<td>1986/7/7</td>
|
|
</tr>
|
|
<tr>
|
|
<td>foo@mountdev.net</td>
|
|
<td>07328</td>
|
|
<td>941-964-3503</td>
|
|
<td>$2486.92</td>
|
|
<td>http://www.dn.se</td>
|
|
<td>1999/7/24</td>
|
|
</tr>
|
|
<tr>
|
|
<td>lost@flexomat.com</td>
|
|
<td>66996</td>
|
|
<td>941-964-5705</td>
|
|
<td>$3333.71</td>
|
|
<td>http://www.aftonbladet.se</td>
|
|
<td>1989/1/17</td>
|
|
</tr>
|
|
<tr>
|
|
<td>henry@donuts.com</td>
|
|
<td>83394</td>
|
|
<td>941-964-3776</td>
|
|
<td>$1808.67</td>
|
|
<td>http://dn.se</td>
|
|
<td>1981/6/14</td>
|
|
</tr>
|
|
<tr>
|
|
<td>muffins@fish.org</td>
|
|
<td>76935</td>
|
|
<td>941-964-5150</td>
|
|
<td>$403.02</td>
|
|
<td>http://www.samba.org</td>
|
|
<td>1986/7/13</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
|
|
|
|
|
|
<script src="tablefilter/tablefilter.js"></script>
|
|
|
|
|
|
<style data-config>
|
|
/**
|
|
* Grid layout custom classes
|
|
*/
|
|
|
|
/* main container */
|
|
.grd-main-cont{
|
|
overflow: hidden;
|
|
background-color: #f4f4f4;
|
|
}
|
|
|
|
/* headers container */
|
|
.grd-head-cont{
|
|
overflow: hidden;
|
|
background-color: #4A4A4A;
|
|
}
|
|
|
|
/* header cell */
|
|
.grd-head-cont th{
|
|
background-color: #4A4A4A;
|
|
padding: 0.5em;
|
|
color: #fff;
|
|
border-right: 1px dotted #fff;
|
|
height: 40px;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
}
|
|
|
|
/* table container */
|
|
.grd-cont{
|
|
background-color: #f4f4f4;
|
|
overflow-x: auto;
|
|
overflow-y: scroll;
|
|
}
|
|
|
|
/* cell */
|
|
.grd-cont td{
|
|
padding: 0.5em 0.5em;
|
|
border-bottom: 1px solid #ccc;
|
|
border-right: 1px dotted #666;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
}
|
|
|
|
/* head and body tables */
|
|
.grd-head-cont table, .grd-cont table{
|
|
font-size: 1.1em;
|
|
border-collapse: collapse;
|
|
}
|
|
|
|
/* bottom toolbar override */
|
|
.grd-main-cont > .grd_inf {
|
|
background-color: #ccc;
|
|
border-top: 1px solid #999;
|
|
}
|
|
</style>
|
|
|
|
<script data-config>
|
|
var tfConfig = {
|
|
base_path: 'tablefilter/',
|
|
col_widths: [
|
|
'200px','60px','125px',
|
|
'100px','250px','100px'
|
|
],
|
|
col_types: [
|
|
'string', 'number', 'string',
|
|
'number', 'string', 'date'
|
|
],
|
|
alternate_rows: true,
|
|
rows_counter: true,
|
|
loader: true,
|
|
|
|
// grid layout customisation
|
|
grid_layout: {
|
|
width: '890px',
|
|
height: '400px',
|
|
filters: false,
|
|
cont_css_class: 'grd-main-cont',
|
|
tbl_head_css_class: 'grd-head-cont',
|
|
tbl_cont_css_class: 'grd-cont'
|
|
},
|
|
|
|
extensions:[{
|
|
name: 'sort'
|
|
}]
|
|
};
|
|
var tf = new TableFilter(
|
|
document.querySelector('.dummy'),
|
|
tfConfig
|
|
);
|
|
tf.init();
|
|
</script>
|
|
|
|
<hr>
|
|
<ul class="nav nav-pills">
|
|
<li class="active">
|
|
<a data-toggle="tab" href="#js">JS</a>
|
|
</li>
|
|
<li>
|
|
<a data-toggle="tab" href="#html">HTML</a>
|
|
</li>
|
|
<li>
|
|
<a data-toggle="tab" href="#css">CSS</a>
|
|
</li>
|
|
</ul>
|
|
|
|
<div class="tab-content">
|
|
<div id="js" class="tab-pane fade in active">
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<!--
|
|
DO NOT COPY: NOT PART OF TABLEFILTER
|
|
-->
|
|
<pre class="js">
|
|
<code class="javascript"></code>
|
|
</pre>
|
|
<script src="assets/js/js-code-in-pre.js"></script>
|
|
<!-- -->
|
|
|
|
|
|
|
|
|
|
|
|
</div>
|
|
<div id="html" class="tab-pane fade">
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<!--
|
|
DO NOT COPY: NOT PART OF TABLEFILTER
|
|
-->
|
|
<pre class="html">
|
|
<code class="xml"></code>
|
|
</pre>
|
|
<script src="assets/js/html-code-in-pre.js"></script>
|
|
<!-- -->
|
|
|
|
|
|
|
|
|
|
|
|
</div>
|
|
<div id="css" class="tab-pane fade">
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<!--
|
|
DO NOT COPY: NOT PART OF TABLEFILTER
|
|
-->
|
|
<pre class="css">
|
|
<code class="css"></code>
|
|
</pre>
|
|
<script src="assets/js/css-code-in-pre.js"></script>
|
|
<!-- -->
|
|
|
|
|
|
|
|
|
|
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<nav class="navbar navbar-default navbar-bottom">
|
|
<div class="container">
|
|
<ul class="nav navbar-nav">
|
|
<li>
|
|
<a href="https://github.com/koalyptus/TableFilter">Repo</a>
|
|
</li>
|
|
<li>
|
|
<a href="https://github.com/koalyptus/TableFilter/wiki">Wiki</a>
|
|
</li>
|
|
<li>
|
|
<a href="./docs" target="_blank">Docs</a>
|
|
</li>
|
|
</ul>
|
|
<ul class="nav navbar-nav navbar-right">
|
|
<li>
|
|
<p>
|
|
<form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_blank">
|
|
<input type="hidden" name="cmd" value="_donations">
|
|
<input type="hidden" name="business" value="maxgug@hotmail.com">
|
|
<input type="hidden" name="lc" value="BM">
|
|
<input type="hidden" name="item_name" value="TableFilter">
|
|
<input type="hidden" name="no_note" value="0">
|
|
<input type="hidden" name="currency_code" value="USD">
|
|
<input type="hidden" name="bn" value="PP-DonationsBF:btn_donate_LG.gif:NonHosted">
|
|
<input type="image" src="https://www.paypalobjects.com/en_US/i/btn/btn_donate_LG.gif" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!">
|
|
<img alt="" border="0" src="https://www.paypalobjects.com/en_AU/i/scr/pixel.gif" width="1" height="1">
|
|
</form>
|
|
</p>
|
|
</li>
|
|
<li>
|
|
|
|
<a href="https://flattr.com/submit/auto?user_id=koalyptus&
|
|
url=https%3A%2F%2Fgithub.com%2Fkoalyptus%2FTablefilter">
|
|
<img src="https://api.flattr.com/button/flattr-badge-large.png"
|
|
alt="TableFilter - A Javascript library making HTML tables filterable
|
|
and a bit more" />
|
|
</a>
|
|
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</nav>
|
|
|
|
|
|
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
|
|
<script src="https://code.jquery.com/jquery.min.js"></script>
|
|
<!-- Include all compiled plugins (below), or include individual files as needed -->
|
|
<script src="assets/js/bootstrap.min.js"></script>
|
|
|
|
<script src="assets/js/github-fork-me.js"></script>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<!--
|
|
DO NOT COPY: NOT PART OF TABLEFILTER
|
|
-->
|
|
<link rel="stylesheet" href="assets/js/highlight/styles/monokai-sublime.css">
|
|
<script src="assets/js/highlight/highlight.pack.js"></script>
|
|
<script>hljs.initHighlightingOnLoad();</script>
|
|
<!-- -->
|
|
|
|
|
|
<script type="text/javascript"
|
|
src="//s7.addthis.com/js/300/addthis_widget.js#pubid=maxgug"
|
|
async="async"></script>
|
|
|
|
<script>
|
|
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
|
|
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
|
|
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
|
|
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
|
|
|
|
ga('create', 'UA-68429903-1', 'auto');
|
|
ga('send', 'pageview');
|
|
</script>
|
|
</body>
|
|
</html>
|