CODEWITHSUNDEEP
jquerypaginationhtml-tabletablesorter
lukas
lukas

Reputation: 1

jQuery tablesorter&pager plugin doesn't work correct

I'm trying to get the pager of the jQuery tablesorter to work. Without the pager everything works just fine, but when I'm trying to use the pager something goes wrong.

When I don't change the limit of the pager from 10 to 5 or 2, neither the sorting nor the paging is working. It then shows me an empty table. But when I'm changing the limit beforehand everything works?! That's not the way it should be, right? ^^

jquery:

   <script>
    $(document).ready(function(){
        var validator = $("#searchForm").validate({ 

        });         
    });

    $(document).ready(function() 
    { 
        $("#myTable")
        .tablesorter({widthFixed: true, widgets: ['zebra']})
        .tablesorterPager({container: $("#pager")}); 
    });

table:

// name of database dable == header of table
                echo "<table id=\"myTable\"     class=\"tablesorter\"><thead><tr>";
                foreach( sqlsrv_field_metadata($stmt) as     $fieldMetadata)
                {
                       echo "<th>".$fieldMetadata   ['Name']."</th>";
                }
                echo "<th>Details</th>";
                echo "</thead>";
                echo "<tbody>";
                // printing table rows
                while($row = sqlsrv_fetch_array($stmt,    SQLSRV_FETCH_ASSOC))
                {                                   
                    echo "<tr>";

                    // $row is array... foreach( .. ) puts every element    
                    // of $row to $cell variable    
                    foreach($row as $cell){
                        echo "<td>$cell</td>";
                    }
                    echo "</tr>\n";
                }
                echo "</tbody>";
                echo "</table>";    
                echo("<br>");

pager:

 <div id="pager" class="pager">
                    <form>
                        <img     src="/images/first.png" class="first"/>
                        <img     src="/images/prev.png" class="prev"/>
                        <input type="text"    class="pagedisplay"/>
                        <img   src="/images/next.png" class="next"/>
                        <img    src="/images/last.png" class="last"/>
                        <select class="pagesize">
                            <option   value="">>LIMIT</option>
                            <option value="2">2 per page</option>
                            <option value="5">5 per page</option>
                            <option value="10">10 per page</option>                             
                        </select>
                    </form>
                </div>

Upvotes: 0

Views: 356

Answers (1)

paul
paul

Reputation: 22001

does specifying 10 in the first call help?

$(document).ready(function() 
{ 
    $("#myTable")
    .tablesorter({widthFixed: true, widgets: ['zebra']})
    .tablesorterPager({container: $("#pager"), size: 10}); 
});

Upvotes: 1

Related Questions