File
Add library
Share
Login or Register
Help
HTML
 
<!DOCTYPE html>
<html>
    <head>
        <link href="//datatables.net/download/build/nightly/jquery.dataTables.css" rel="stylesheet" type="text/css" />
​
        <script src="https://code.jquery.com/jquery-1.9.1.min.js"></script>
        <script src="//datatables.net/download/build/nightly/jquery.dataTables.js"></script>
​
        <meta charset=utf-8 />
        <title>DataTables - JS Bin</title>
    </head>
    <body>
        <div class="container">
            <table id="example" class="display" width="100%">
                <thead>
                    <tr>
                      <th>Revision</th>
​
                    </tr>
                </thead>
​
                <tfoot>
                    <tr>
                      <th>Revision</th>
​
                    </tr>
                </tfoot>
​
                <tbody>
​
                </tbody>
            </table>
        </div>
    </body>
</html>
CSS
 
body {
    font: 90%/1.45em "Helvetica Neue", HelveticaNeue, Verdana, Arial, Helvetica, sans-serif;
    margin: 0;
    padding: 0;
    color: #333;
    background-color: #fff;
}
​
​
div.container {
    min-width: 980px;
    margin: 0 auto;
}
​
​
JavaScript
 
$(document).ready( function () {
​
 aaData = [["47*"],["1"],["2"],["3"],["11"],["12"],["13"],["20"],["21"],["22"],["23"],["769"]];
   
  var table = $('#example').DataTable( {
    paging: false,        
    "aaData": aaData,  //the data for the table
              "columnDefs": [
                { type: 'percent', targets: 0 }
            ] 
    } );
} );
​
jQuery.extend( jQuery.fn.dataTableExt.oSort, {
            "percent-pre": function ( a ) {
                var x = (a == "-") ? 0 : a.replace( /\*/, "" );
                return parseFloat( x );
            },
​
            "percent-asc": function ( a, b ) {
                return ((a < b) ? -1 : ((a > b) ? 1 : 0));
            },
​
            "percent-desc": function ( a, b ) {
                return ((a < b) ? 1 : ((a > b) ? -1 : 0));
            }
} );
Output 300px

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers