You must Sign In to post a response.
  • Category: ASP.NET

    Pagination in with Bootstrap JavaScript file


    I want to apply the below (please refer the attachment) pagination method in our web application. Hence we are using bootstrap plugin "ui-bootstrap-tpls-2.5.0.js". I have tried to change the function but unable to do it. Could any one help me that how to do it....

    below is my code to call that pagination function.

    <ul uib-pagination total-items="totalProducts" ng-model="currentPage" max-size="maxSize" class="agProduct" boundary-link-numbers="true" items-per-page="itemsPerPage" ng-change="pageChangeHandler()"> </ul>
  • #769152
    gridview is nothing but a combination of TD and TR rows.
    checkout following CSS and see if it works for you

    .table table tbody tr td a ,
    .table table tbody tr td span {
    position: relative;
    float: left;
    padding: 6px 12px;
    margin-left: -1px;
    line-height: 1.42857143;
    color: #337ab7;
    text-decoration: none;
    background-color: #fff;
    border: 1px solid #ddd;

    .table table > tbody > tr > td > span {
    z-index: 3;
    color: #fff;
    cursor: default;
    background-color: #337ab7;
    border-color: #337ab7;

    .table table > tbody > tr > td:first-child > a,
    .table table > tbody > tr > td:first-child > span {
    margin-left: 0;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;

    .table table > tbody > tr > td:last-child > a,
    .table table > tbody > tr > td:last-child > span {
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;

    .table table > tbody > tr > td > a:hover,
    .table table > tbody > tr > td > span:hover,
    .table table > tbody > tr > td > a:focus,
    .table table > tbody > tr > td > span:focus {
    z-index: 2;
    color: #23527c;
    background-color: #eee;
    border-color: #ddd;
    /*end gridview */

    //assign it as below
    < asp:GridView ID="GridView1"
    CssClass="table table-striped table-bordered table-hover"
    runat="server" PageSize="10"
    AllowPaging="true" ></asp:GridView>

    Editor, DotNetSpider MVM
    Microsoft MVP 2014 [ASP.NET/IIS]

  • Sign In to post your comments