Icontem

File: examples/Example1.html

Recommend this page to a friend!
  Classes of Jackson Knowlton  >  JS Sortable Table  >  examples/Example1.html  >  Download  
File: examples/Example1.html
Role: Example script
Content type: text/plain
Description: Basic Usage
Class: JS Sortable Table
Make HTML tables sortable with clickable headers
Author: By
Last change: Changed folder placement
Date: 4 years ago
Size: 1,270 bytes
 

Contents

Class file image Download
<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>Simplest Use</title>

    <script src="https://code.jquery.com/jquery-2.1.3.min.js"></script>

    <script language="javascript" src="../sortableTable.class.js"></script>

    <link rel="stylesheet" href="../sortableTable.css"/>

    <style>
        table, td, th{
            border-collapse: collapse;
            border: 1px solid black;
        }
    </style>
</head>
<body>

<table class="sortable">
    <tr>
        <th>ID</th>
        <th>First Name</th>
        <th>Last Name</th>
        <th>Email</th>
    </tr>
    <tr>
        <td>1</td>
        <td>George</td>
        <td>Jones</td>
        <td>123jones.george@example.com</td>
    </tr>
    <tr>
        <td>2</td>
        <td>Billy</td>
        <td>Smith</td>
        <td>smith.billy@example.com</td>
    </tr>
    <tr>
        <td>3</td>
        <td>Jon</td>
        <td>Dowe</td>
        <td>jon.dowe@example.com</td>
    </tr>
    <tr>
        <td>4</td>
        <td>Billy</td>
        <td>Jones</td>
        <td>jones.billy@example.com</td>
    </tr>
</table>

<script>
    var sTable = new sortableTable();
    sTable.init('.sortable');
</script>
</body>
</html>