jquery tablesorter index column insert

I have a PHP generated table from a postgres query. How can I insert an index column with numbered rows at the beginning of the table using tablesorter plugin? The sorting works. Thank you.

klejgkekrj

qwef

<html>
    <head>
        <link href="/media/css/blue/style.css" rel="stylesheet">
        <script src="/media/js/jquery.js" type="text/javascript"></script>
        <script src="/media/js/jquery.tablesorter.js" type="text/javascript"></script>
        <script src="/media/js/jquery.tablesorter.widgets.js" type="text/javascript">  </script>
        <script src="/media/js/jquery.tablesorter.pager.js" type="text/javascript"></script>

        <script type="text/javascript">
            $(function(){
              $("#tabel").tablesorter({ widgets: [ 'zebra' , 'filter' ] })

            });
        </script>               
    </head>

<body>

<?php

$con = pg_connect("user=* password=* host=localhost port=5432 dbname=users ") or die (pg_last_error());
$query = "SELECT * from users";
$result = pg_query($con, $query);

echo "<table id=\"tabel\" class=\"tablesorter\">
<thead>
<tr>";
//next code get column names
for($i=0; $i < pg_num_fields($result); $i++){
    $field_info = pg_field_name($result, $i);
 echo "<th> $field_info  </th>";
}
echo "
</tr>
</thead>";


//next code fetch cells content
echo "<tbody>";

while ($row=pg_fetch_row($result)){
    echo "<tr>";
    foreach($row as $_column){
    echo "<td> $_column </td>";
    }
    echo "</tr>";

}
echo "</tbody>
</table>";

pg_close($con);

?>
</body>
</html>

I'm not that great with php, but couldn't you just do this?

echo "<table id=\"tabel\" class=\"tablesorter\">
<thead>
<tr>
<th>#</th>";
.
.
.
//next code fetch cells content
echo "<tbody>";

$i=1;

while ($row=pg_fetch_row($result)){
    echo "<tr>";
    echo "<td> $i </td>";
    $i++;

    foreach($row as $_column){
    echo "<td> $_column </td>";
    }
    echo "</tr>";

}

If you want a that column to not sort and stay unchanged, you can use the following widget (demo) with header option to prevent sorting:

// target the number column using a zero-based index
var number_column = 0;

// add custom numbering widget
$.tablesorter.addWidget({
    id: "numbering",
    format: function(table) {
        var c = table.config;
        $("tr:visible", table.tBodies[0]).each(function(i) {
            $(this).find('td').eq(number_column).text(i + 1);
        });
    }
});

$("table").tablesorter({
    theme: 'blue',
    // prevent first column from being sortable
    headers: {
        0: { sorter: false }
    },
    // apply custom widget
    widgets: ['numbering']
});

来源：https://stackoverflow.com/questions/18763027/jquery-tablesorter-index-column-insert

标签

php

jquery

tablesorter