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

    Pagination in ASP.net with Bootstrap JavaScript file

    Hi,

    I want to apply the below (please refer the attachment) pagination method in our ASP.net 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 asp.net 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

    /*gridview*/
    .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>


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


Sign In to post your comments