Tweet
I would like to put a table in my site with the ability to sort it out online.
Any ideas?
Thanks
Ophir
Any ideas?
Thanks
Ophir
-
-
Re: How do i make a table that can be sorted?
You can try this one i was messing around with. Paste the code into a html box on your BV page & preview. There is a sample here.
<script src="sorttable.js" type="text/javascript"></script>
<style type="text/css">
div.main{margin:1px auto; width:720px;}
table.sortable{border:1; font-size:14px; padding:1px; margin:1;}
table.sortable td{padding:1px;border:solid 1px #8b8b00;}
table.sortable th{padding:1px;}
table.sortable thead{background:#8b8b00; font-size:12px; color:#ffffff; text-align:center;}
table.sortable tfoot{}
table.sortable tfoot td{border:none;}
</style>
</head>
<body>
<div class="main">
<td>Click on any white text in the top row to sort columns - <b>D</b>=Degree of walk from 1-6, 1=easy.(<a href="javascript:popupwnd('http://barnetwalks.co.uk/grading.php','no','no','no','no','no','no','300',' 50','550','400')" target="_self" class="style1">More info</a></font>)<br>
<b>Photo's</b> links to an album with Googl map links. <B>Map</b> link's to a pdf download of the walk with directions</td>
<table class="sortable" cellspacing="1;">
<thead>
<tr><th>Ref</th><th>D</th><th>From</th><th>Via</th></th><th>To</th></th><th>Miles</th></th><th>Map</th><th>Photo</th></tr>
</thead>
<tbody>
<tr><td>MH4</td><td>1</td><td>Page st Mill Hill NW7 with a detour to spain</td><td>Copthall sbd gbd</td><td>Devon Rd sbsfgs sfvsfv</td><td>4.2</td><td>Map</td><td>Photo</td></tr>
<tr><td>MH1</td><td>5</td><td>From....................................... ........</td><td>Via..................................</td><td>To........................................</td><td>Miles</td><td>Map</td><td>Photo</td></tr>
<tr><td>MH2</td><td>5</td><td>From</td><td>Via</td><td>To</td><td>Miles</td><td>Map</td><td>Photo</td></tr>
<tr><td>MH3</td><td>5</td><td>From</td><td>Via</td><td>To</td><td>Miles</td><td>Map</td><td>Photo</td></tr>
<tr><td>MH5</td><td>5</td><td>From</td><td>Via</td><td>To</td><td>Miles</td><td>Map</td><td>Photo</td></tr>
<tr><td>MH6</td><td>5</td><td>From</td><td>Via</td><td>To</td><td>Miles</td><td>Map</td><td>Photo</td></tr>
<tr><td>MH7</td><td>5</td><td>From</td><td>Via</td><td>To</td><td>Miles</td><td>Map</td><td>Photo</td></tr>
<tr><td>MH8</td><td>5</td><td>From</td><td>Via</td><td>To</td><td>Miles</td><td>Map</td><td>Photo</td></tr>
<tr><td>MH9</td><td>5</td><td>From</td><td>Via</td><td>To</td><td>Miles</td><td>Map</td><td>Photo</td></tr>
<tr><td>MH10</td><td>5</td><td>From</td><td>Via</td><td>To</td><td>Miles</td><td>Map</td><td>Photo</td></tr>
<tr><td>MH11</td><td>5</td><td>From</td><td>Via</td><td>To</td><td>Miles</td><td>Map</td><td>Photo</td></tr>
<tr><td>MH12</td><td>5</td><td>From</td><td>Via</td><td>To</td><td>Miles</td><td>Map</td><td>Photo</td></tr>
<tr><td>MH13</td><td>5</td><td>From</td><td>Via</td><td>To</td><td>Miles</td><td>Map</td><td>Photo</td></tr>
<tr><td>MH14</td><td>5</td><td>From</td><td>Via</td><td>To</td><td>Miles</td><td>Map</td><td>Photo</td></tr>
<tr><td>MH15</td><td>5</td><td>From</td><td>Via</td><td>To</td><td>Miles</td><td>Map</td><td>Photo</td></tr>
<tr><td>MH16</td><td>5</td><td>From</td><td>Via</td><td>To</td><td>Miles</td><td>Map</td><td>Photo</td></tr>
<tr><td>MH17</td><td>5</td><td>From</td><td>Via</td><td>To</td><td>Miles</td><td>Map</td><td>Photo</td></tr>
<tr><td>MH18</td><td>5</td><td>From</td><td>Via</td><td>To</td><td>Miles</td><td>Map</td><td>Photo</td></tr>
<tr><td>MH19</td><td>5</td><td>From</td><td>Via</td><td>To</td><td>Miles</td><td>Map</td><td>Photo</td></tr>
</tbody>
<tfoot>
<tr><td></td><td></td><td></td></tr>
</tfoot>
</table
Comment