Question

In my web application I have maintain table for the user records. Records are added and deleted on client send and than user clicks on save button to save all the manipulations done on the server.

I have applied table sorter for the sorting functionality on the table. But surprisingly sorted functionality is working fine for only ID field ie the first field of table, but for all other fields, it is giving error (error trace from chrome)

Uncaught TypeError: Cannot read property 'type' of undefined
multisortjquery.tablesorter.js:600
$.extend.tablesorter.construct.each.$headers.click.mousedown.onselectstart 

Here is the table structure.

<table id="contentTable" class="tablesorter">
                        <thead>
                            <tr>
                                <th> ID </th>
                                <th> Name </th>
                                <th> Birth Date </th>
                                <th> City </th>
                                <th id="actionheader"> Action</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr>
                                <td></td>
                            </tr>
                        </tbody>
                    </table>

In this I add data dynamically. In this situation sorting is working fine for only first field ie ID field

This is how I initialized the tableSorting.

  function initializeTableSorting() {
        $("#contentTable").tablesorter({
            sortList : [[0, 0]],
            headers : {
                0 : {
                    sorter : "integer"
                },
                1 : {
                    sorter : "text"
                },
                2 : {
                    sorter : false
                },
                3 : {
                    sorter : "text"
                },
                4 : {
                    sorter : false
                }
            }
        });
    }

How can I make this work for all fields, even also for date field if I remove the false option from the initialization ?

Answer 1

I can’t duplicate the reported error, but if I follow the programming logic…

The error you are describing occurs on this line of code:

var s = (table.config.parsers[c].type == "text") ...

Which means that parsers[c] doesn’t exist. The variable c is just the column index.

So, if I had to guess, I’d say there is a custom parser involved but it doesn’t have a type attribute defined.

// default text parser
ts.addParser({
    id: "text",
    is: function (s) {
        return true;
    },
    format: function (s) {
        return $.trim(s.toLocaleLowerCase());
    },
    type: "text"
});

Or, it could be a problem with the definition of the sortList. Make sure the correct number of square brackets are around the variables:

var sorting = [[0, 0]];
$("#contentTable").trigger("sorton", [sorting]);

or in compressed form:

// more than one column -> [[ [0,0], [1,0] ]]
$("#contentTable").trigger("sorton", [[[0, 0]]]);

Try out this demo