AjaxTable

The purpose of AjaxTable is to provide an easy to use Javascript table representation which uses a server side script as a data source. The table provides sorting and paging with customizable batch sizes.

View a Demo AjaxTable

Setting up a Data Source

The AjaxTable makes requests to the data source script when new data is needed. The script should take the following parameters:

    start    - index of the first row to return
    end      - index of the last row to return
    order_by - column to order by
    reverse  - Flag stating if the results should be reversed

The script should provide it's output in the following format:

    # of Total Rows
    Column IDs (tab separated)
    Column Titles (tab separated)
    Row Data (tab separated)

Example Output

    2199
    name    age    weight
    Name    Age    Weight (lbs)
    Brian   29     200
    Steve   25     185
    John    19     190
    Don     35     240

Creating an AjaxTable

    <script>
        var table = new AjaxTable('table_id','/data_source.py');
        table.updateData();
    </script>

AjaxTable Methods

    function initialize();
    
        Depricated, calls updateData();

    function updateData();
    
        Refresh the data in the table
        
    function setUnsortable(column_id);
    
        Set a column to be unsortable. 
        Must be called before the first updateData call.
        
    function setWidth(width);
    
        Sets the tables width. Default is 100%;
        
    function setColumnWidth(column_id, width);
    
        Sets the specified column to the specified width.
        Must be called before the first updateData call.

    function setRowsPerPage(num_rows);
    
        Sets the number of rows visible per page, valid options
        are 10, 25, 100, and 500.

    function setEmptyMessage(message);

        Set the message users see when the table contains
        no data.
        
    function setParameter(name, value);
    
        Allows you to specify additional parameters to send
        to the data source script. Can be used to provide
        additional features such as searching and filtering.

AjaxTable Attributes

    id              ID of the tables container DIV
    data_source     Name of the data source script
    row_count       Number of rows in current set
    rows_per_page   Number of rows per page
    row_start       Index of first row displayed
    row_end         Index of last row displayed
    order_by        ID of current sorting column
    reverse         Flagged if results are reversed
    loading         Flagged if table is currently loading data
    column_count    Number of columns
    initialized     Flagged once initial updateData is called