user1480864
user1480864

Reputation: 1585

bootstrap paging not working

Bootstrap paging is not working. I don't see page# in textbox in pager and it throws error to in jquery.tablesorter.pager.js function moveToFirstPage ln#33 which is table.config. table.config is unavailable.

Code looks like:

    <table cellspacing="1" class="tablesorter">
    <thead>
        <tr>
            <th>col1</th>
            <th>col2</th> 
        </tr>
    </thead>
         <tbody>
        <tr>
            <td>val1</td>
            <td>val2</td>
                  </tr>
          </tbody>
    </table>
<div id="pager" class="pager" style="position:absolute;width:100%;background-color:#8F8F8F;color:White;">
        <form>
            <img src="@Url.Content("~/Content/images/first.png")" class="first"/>
            <img src="@Url.Content("~/Content/images/prev.png")" class="prev"/>
            <input type="text" class="pagedisplay" readonly="readonly" style="width:auto" />
            <img src="@Url.Content("~/Content/images/next.png")" class="next"/>
            <img src="@Url.Content("~/Content/images/last.png")" class="last"/>
            Show <select class="pagesize" style="width:auto;">
                <option selected="selected"  value="10">10</option>
                <option value="20">20</option>
                <option value="30">30</option>
                <option  value="40">40</option>
            </select> items
        </form></div>

Jquery:

$("table").tablesorterPager({ container: $("#pager") });

what is missing?

Upvotes: 0

Views: 947

Answers (1)

ashisrai_
ashisrai_

Reputation: 6568

The big thing you are missing is making table itself table sorter. Just call tablesorter before tablesorterPager and there you go.

$("table").tablesorter().tablesorterPager({ container: $("#pager") });

BTW, your table row and the pager option need to set properly.

Upvotes: 1

Related Questions