Tablesorter demo

All options included, as well as the uitheme widget

by Mottie

HTML

<link rel="stylesheet" href="https://mottie.github.io/tablesorter/css/theme.blue.css">
<script src="https://mottie.github.io/tablesorter/js/jquery.tablesorter.js"></script>
<script src="https://mottie.github.io/tablesorter/js/jquery.tablesorter.widgets.js"></script>
<script src="https://mottie.github.io/tablesorter/js/widgets/widget-output.js"></script>
<script src="https://mottie.github.io/tablesorter/js/parsers/parser-input-select.js"></script>
<button class="download">Get CSV</button>

<table class="tablesorter">
    <thead>
        <tr>
            <th>AlphaNumeric</th>
            <th>Numeric</th>
            <th>Animals</th>
            <th class="sorter-select">Values</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>abc 123</td>
            <td>10</td>
            <td>Koala</td>
            <td><select><option>A</option><option selected="">B</option><option>C</option></select></td>
        </tr>
        <tr>
            <td>abc 1</td>
            <td>234</td>
            <td>Ox</td>
            <td><select><option selected="">A</option><option>B</option><option>C</option></select></td>
        </tr>
        <tr>
            <td>abc 9</td>
            <td>10</td>
            <td>Girafee</td>
            <td><select><option selected="">A</option><option>B</option><option>C</option></select></td>
        </tr>
        <tr>
            <td>zyx 24</td>
            <td>767</td>
            <td>Bison</td>
            <td><select><option>A</option><option selected="">B</option><option>C</option></select></td>
        </tr>
        <tr>
            <td>abc 11</td>
            <td>3</td>
            <td>Chimp</td>
            <td><select><option>A</option><option selected="">B</option><option>C</option></select></td>
        </tr>
        <tr>
            <td>abc 2</td>
            <td>56</td>
            <td>Elephant</td>
            <td><select><option>A</option><option>B</option><option selected="">C</option></select></td>
        </tr>
  ...

JavaScript

$(function () {

    var $table = $('table');
    
    $('.download').click(function(){
        $table.trigger('outputTable');
    });

    $table.tablesorter({
        theme: 'blue',
        widgets: ['zebra', 'output'],
        widgetOptions: {
        	output_formatContent : function( c, wo, data ) {
            var $select = data.$cell.find('select');
          	if ($select.length) {
            	return $select.find('option:checked').text();
            }
            return data.content;
          }
        }
    });
});