Skip to main content

Jquery Paging in MVC

In js file :
var _currentPageID = 1;
var _pageSize = 10;
var _sortExpression = '';
var _sortDirection = 1;
var _accessUrl = '';
var _gridDivId = 'ajaxGrid';
var _searchBoxDivId = 'searchFilter';
var _searchParameters = [];

function asynList()
{
    var jsonParameters = { "CurrentPageID": _currentPageID, "PageSize": _pageSize, "SortingColumn": _sortExpression, "SortingOrder": _sortDirection, "SearchParameter": _searchParameters };
    $.ajax({
        type: 'POST',
        contentType: 'application/json',
        data: JSON.stringify({ TablePaging: jsonParameters }),
        url: _accessUrl,
        success: function (result)
        {
            $('#' + _gridDivId).html(result);
            $('.sort-icon').removeClass('sort-asc');
            $('.sort-icon').removeClass('sort-desc');

            $('.sort-icon').each(function (index)
            {
                if ($(this).attr('onclick') == "sortRequest('" + _sortExpression + "')") {
                    if (_sortDirection == 1) {
                        $(this).addClass('sort-asc');
                    }
                    else {
                        $(this).addClass('sort-desc');
                    }
                }
            });

        },
        error: function (request, status, error)
        {
            // look for status of 401 and redirect to login
            if (status == 403) {
                window.location = "/";
            }
        }
    });
}

$(document).ready(function ()
{
    $('#selectPageSize').live("change", function ()
    {
        _pageSize = parseInt(this.value);
        _currentPageID = 1;
        asynList();
    });
});

function pageRequest(pageid)
{
    _currentPageID = parseInt(pageid);
    asynList();
}

function searchRequest()
{
    _searchParameters.splice(0, _searchParameters.length);
    $('#' + _searchBoxDivId).find('input:text').each(function ()
    {
        if ($(this).val() != '' && $(this).val() != null) {
            var parameter = { Key: $(this).attr('name'), Value: $(this).val() }
            _searchParameters.push(parameter);
        }
    });
    $('#' + _searchBoxDivId).find('input:checkbox').each(function ()
    {
        var parameter = { Key: $(this).attr('name'), Value: $(this).is(':checked') }
        _searchParameters.push(parameter);
    });
    $('#' + _searchBoxDivId).find('select').each(function ()
    {
        if ($(this).val() != '' && $(this).val() != null) {
            var parameter = { Key: $(this).attr('name'), Value: $(this).val() }
            _searchParameters.push(parameter);
        }
    });
    _currentPageID = 1;
    asynList();
}

function sortRequest(sortColumn)
{
    if (_sortExpression == sortColumn) {
        if (_sortDirection == 1) {
            _sortDirection = 2;
        }
        else {
            _sortDirection = 1;
        }
    }
    else {
        _sortDirection = 1;
    }
    _currentPageID = 1;
    _sortExpression = sortColumn;
    asynList();
}
--------------------------------------------------------------------------------------
Partial View :
@{
    Layout = null;
}
@if (ViewBag.DataPagingModel != null)
{
    StudyUncle.Models.Control.DataPagingModel PagingModel = (StudyUncle.Models.Control.DataPagingModel)ViewBag.DataPagingModel;

    if (PagingModel.TotalRecords > 0)
    {
        PagingModel.TotalPages = (PagingModel.TotalRecords / PagingModel.PageSize) + ((PagingModel.TotalRecords % PagingModel.PageSize == 0) ? 0 : 1);
        PagingModel.StartRecord = (PagingModel.TotalRecords == 0) ? 0 : (((PagingModel.CurrentPageID - 1) * PagingModel.PageSize) + 1);
        PagingModel.EndRecord = (PagingModel.TotalPages == PagingModel.CurrentPageID || PagingModel.TotalRecords == 0) ? PagingModel.TotalRecords : (((PagingModel.CurrentPageID - 1) * PagingModel.PageSize) + PagingModel.PageSize);


        PagingModel.StartPageNumber = 1;
        PagingModel.EndPageNumber = PagingModel.TotalPages;
        if (PagingModel.TotalPages > 8 && PagingModel.CurrentPageID > 4)
        {
            PagingModel.StartPageNumber = PagingModel.CurrentPageID - 3;
            PagingModel.EndPageNumber = PagingModel.StartPageNumber + 7;
            if (PagingModel.EndPageNumber > PagingModel.TotalPages)
            {
                PagingModel.EndPageNumber = PagingModel.TotalPages;
                PagingModel.StartPageNumber = PagingModel.EndPageNumber - 7;
            }
        }
        else if (PagingModel.CurrentPageID < 5)
        {
            PagingModel.EndPageNumber = PagingModel.TotalPages < 8 ? PagingModel.TotalPages : 8;
        }
       
   
    <div class="widget-paging">
        <div class="page-status">
            <span class="fl margin-right10" style="display: none;">
                <select id="selectPageSize" class="pagination_pagesize select">
                    <option value="10">10</option>
                    <option value="20">20</option>
                    <option value="50">50</option>
                    <option value="100">100</option>
                </select>
            </span>Showing @PagingModel.StartRecord - @PagingModel.EndRecord of @PagingModel.TotalRecords
        </div>
        @if (PagingModel.TotalPages > 1)
        {
            <div class="page-no">
                @if (PagingModel.CurrentPageID == 1)
                {
                    <span class="button orange disabled">First</span>
                    <span class="button orange disabled">Previous</span>
                }
                else
                {
                    <span class="button  orange" onclick="pageRequest('1')">First</span>
                    <span class="button orange" onclick="pageRequest('@(PagingModel.CurrentPageID - 1)')">
                        Previous</span>
                }
                <span>
                    @for (int TStart = PagingModel.StartPageNumber; TStart <= PagingModel.EndPageNumber && TStart <= PagingModel.TotalPages; TStart++)
                    {
                        if (TStart == PagingModel.CurrentPageID)
                        {
                        <span class='button active'>@TStart</span>
                        }
                        else
                        {
                        <span class='button orange' onclick="pageRequest('@TStart')">@TStart</span>
                        }
                    }
                </span>
                @if (PagingModel.CurrentPageID == PagingModel.TotalPages)
                {
                    <span class='button disabled'>Next</span>
                    <span class='button disabled'>Last</span>
                }
                else
                {
                    <span class='button  orange' onclick="pageRequest('@(PagingModel.CurrentPageID + 1)')">
                        Next</span>
                    <span class='button  orange' onclick="pageRequest('@PagingModel.TotalPages')">Last</span>
                }
            </div>
        }
    </div>
    <script type="text/javascript">
        $(document).ready(function () {
            $('#selectPageSize').val('@PagingModel.PageSize');
        });
    </script>
    }
    else
    {
    <span class="no-record">No Record Found</span>
    }
}
-------------------------------------------------------------------------------------------------------
Paging Model :
    public enum SortingOrder
    {
        Ascending = 1,
        Descending = 2
    }

    public class DataPagingModel
    {
        public DataPagingModel()
        {
            CurrentPageID = 0;
            PageSize = 10;
            TotalRecords = 0;
            TotalPages = 0;
            PageUrl = "";
            SearchText = "";
            SortingColumn = "";
            SortingOrder = SortingOrder.Ascending;
        }

        public int CurrentPageID { get; set; }
        public int TotalPages { get; set; }
        public int StartPageNumber { get; set; }
        public int EndPageNumber { get; set; }

        public int TotalRecords { get; set; }
        public int StartRecord { get; set; }
        public int EndRecord { get; set; }

        public int PageSize { get; set; }
        public string PageUrl { get; set; }
        public string AjaxUrl { get; set; }

        public string SortingColumn { get; set; }
        public SortingOrder SortingOrder { get; set; }

        public string SearchText { get; set; }
        
        public bool ShowAllRecord { get; set; }
        
        private Dictionary<string, string> _SearchParameter = new Dictionary<string, string>();
        public Dictionary<string, string> SearchParameter { get { return _SearchParameter; } set { _SearchParameter = value; } }
    }


Comments

Popular posts from this blog

Create Strong Name Assembly

From a VS.NET command prompt, enter the following: 1. Generate a KeyFile sn -k keyPair.snk 2. Get the MSIL for the assembly ildasm SomeAssembly.dll /out:SomeAssembly.il 3. Rename the original assembly, just in case ren SomeAssembly.dll SomeAssembly.dll.orig 4. Build a new assembly from the MSIL output and your KeyFile ilasm SomeAssembly.il /dll /key= keyPair.snk   more read visit : http://www.geekzilla.co.uk/ViewCE64BEF3-51A6-4F1C-90C9-6A76B015C9FB.htm

Remove Duplicate Row in Sql Query

Method 1: -- Create Sample Table DECLARE @ table TABLE ( data VARCHAR ( 20 ) ) -- Insert Some Data INSERT INTO @ table VALUES ( 'not duplicate row' ) INSERT INTO @ table VALUES ( 'duplicate row' ) INSERT INTO @ table VALUES ( 'duplicate row' ) -- Find out Duplicate rows in table : SELECT   data , COUNT ( data ) nr FROM     @ table GROUP BY data HAVING   COUNT ( data ) > 1 -- Remove Duplicate rows from table SET NOCOUNT ON SET ROWCOUNT 1 WHILE 1 = 1    BEGIN       DELETE    FROM @ table       WHERE     data IN ( SELECT   data                                FROM     @ table            ...