Starter

← Documentation

From Destination Road Distance (km) By Air (hrs) By Rail (hrs)
Sydney Adelaide 1412 1.4 25.3
Sydney Brisbane 982 1.5 16
Sydney Canberra 286 .6 4.3
Sydney Melbourne 872 1.1 10.5
Adelaide Perth 2781 3.1 38
Adelaide Alice Springs 1533 2 20.25
Adelaide Brisbane 2045 2.15 40

Source code of the page:

<!DOCTYPE HTML>
<html>
<head>
    <title>ezEditTable, enhance HTML tables easily - Starter page - by Max Guglielmi</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

    <link href="../ezEditTable.css" rel="stylesheet" type="text/css">
    <script src="../ezEditTable.js"></script>
</head>
<body>
    <h1>ezEditTable Starter</h1>

    <table id="demo" cellspacing="0" cellpadding="0">
        <thead>
                    <tr>
                        <th>From</th>
                        <th>Destination</th>
                        <th>Road Distance (km)</th>
                        <th>By Air (hrs)</th>
                        <th width="15%">By Rail (hrs)</th>

                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td><strong>Sydney</strong></td>
                        <td>Adelaide</td>
                        <td>1412</td>
                        <td>1.4</td>
                        <td>25.3</td>
                    </tr>
                    <tr>
                        <td><strong>Sydney</strong></td>
                        <td>Brisbane</td>
                        <td>982</td>
                        <td>1.5</td>
                        <td>16</td>
                    </tr>
                    <tr>
                        <td><strong>Sydney</strong></td>
                        <td>Canberra</td>
                        <td>286</td>
                        <td>.6</td>
                        <td>4.3</td>
                    </tr>
                    <tr>
                        <td><strong>Sydney</strong></td>
                        <td>Melbourne</td>
                        <td>872</td>
                        <td>1.1</td>
                        <td>10.5</td>
                    </tr>
                    <tr>
                        <td><strong>Adelaide</strong></td>
                        <td>Perth</td>
                        <td>2781</td>
                        <td>3.1</td>
                        <td>38</td>
                    </tr>
                    <tr>
                        <td><strong>Adelaide</strong></td>
                        <td>Alice Springs</td>
                        <td>1533</td>
                        <td>2</td>
                        <td>20.25</td>
                    </tr>
                     <tr>
                        <td><strong>Adelaide</strong></td>
                        <td>Brisbane</td>
                        <td>2045</td>
                        <td>2.15</td>
                        <td>40</td>
                    </tr>
        </tbody>
    </table>

    <script language="javascript" type="text/javascript">
        var config = {
            selection: true,
            default_selection: 'both'
        };
        var et = new EditTable('demo', config);
        et.Init();
    </script>

</body>
</html>