Demo

parsed values within the column
Distance (feet & inches)
Fractions
3'
11" 22/12
5'
3" 5 ½
½"
5' 11" ¾
10' 11"
10' 1" 5/6
10' 4" 11/16
5' 9"
5 1/2' 2
5' 3/4" 2⅞
5' 5/8" 3 ¾
5' 3 1/2" 3 ⅛
10' 3⅛" 3/7
10' 2⅜" 3⅜
10' 3⅝" 3 ½
10' 2⅞" 3 ⅝
5' 3¼" 2⅝
5 ' 2 ½ " 2/3
10' 2¾" 5 ⅝
5' 2 ½" 5 ⅜
5' 2.5" 5/16
5' 2 1/2" 2 3/5
10 ' 1 " 3

Page Header

<!-- blue theme stylesheet -->
<link rel="stylesheet" href="../css/theme.blue.css">
<!-- tablesorter plugin -->
<script src="../js/jquery.tablesorter.js"></script>

<!-- load feet-inch-fraction parser -->
<script src="../js/parsers/parser-feet-inch-fraction.js"></script>

Javascript

$(function() {

$('table').tablesorter({
theme: 'blue',
headers: {
0: { sorter: 'distance' },
1: { sorter: 'distance' }
},
widgets: ['zebra']
});

});

HTML


<table class="tablesorter">
<thead>
<tr>
<th>Distance (feet & inches)</th>
<th>Fractions</th>
</tr>
</thead>
<tbody>
<tr><td>3'</td><td></td></tr>
<tr><td>11"</td><td>22/12</td></tr>
<tr><td>5'</td><td></td></tr>
<tr><td>3"</td><td>5 ½</td></tr>
<tr><td>½"</td><td></td></tr>

<tr><td>5' 11"</td><td>¾</td></tr>
<tr><td>10' 11"</td><td></td></tr>
<tr><td>10' 1"</td><td>5/6</td></tr>
<tr><td>10' 4"</td><td>11/16</td></tr>
<tr><td>5' 9"</td><td></td></tr>
<tr><td>5 1/2'</td><td>2</td></tr>

<tr><td>5' 3/4"</td><td>2⅞</td></tr>
<tr><td>5' 5/8"</td><td>3 ¾</td></tr>
<tr><td>5' 3 1/2"</td><td>3 ⅛</td></tr>

<tr><td>10' 3⅛"</td><td>3/7</td></tr>

<tr><td>10' 2⅜"</td><td>3⅜</td></tr>
<tr><td>10' 3⅝"</td><td>3 ½</td></tr>
<tr><td>10' 2⅞"</td><td>3 ⅝</td></tr>
<tr><td>5' 3¼"</td><td>2⅝</td></tr>
<tr><td>5 ' 2 ½ "</td><td>2/3</td></tr>
<tr><td>10' 2¾"</td><td>5 ⅝</td></tr>

<tr><td>5' 2 ½"</td><td>5 ⅜</td></tr>
<tr><td>5' 2.5"</td><td>5/16</td></tr>

<tr><td>5' 2 1/2"</td><td>2 3/5</td></tr>

<tr><td> 10 ' 1 "</td><td>3</td></tr>
</tbody>
</table>