I have a search screen with some search fields on the page. On submit Ajax post returns a partial view grid results with the search fields state maintained . But if I do sorting on the grid first time , the whole page is getting refreshed and I am losing the state of search field inputs. Also the pagination is happening only after doing sorting at least once. I am using Grid.Mvc.Ajax package for displaying the results in grids. I am new to Web development in Asp.net. Can any body help out in resolving this issue.

----------Controller Code -----------------------------

public class CaseSearchController : Controller
    {
        private IGridMvcHelper gridMvcHelper;

        public CaseSearchController()
        {
            this.gridMvcHelper = new GridMvcHelper();
        }

        [HttpGet]
        public ActionResult CaseSearch()
        {
            return View();
        }

        [HttpPost]
        public ActionResult CaseSearchResult(CaseSearchCondition searchCondition)
        {
            CaseLogic caseLogic = new CaseLogic();
            var caseList = caseLogic.SearchCasesByCondition(searchCondition).AsQueryable();
            var items = caseList.OrderBy(f => f.CaseId);
            var grid = this.gridMvcHelper.GetAjaxGrid(items);
            Session["Cases"] = caseList;
            return PartialView("CaseSearchResult", grid);
        }

        public ActionResult GetGrid()
        {
            IQueryable<CaseSearchResult> caseList = new List<CaseSearchResult>().AsQueryable();
            if (Session["Cases"] != null)
            {
                caseList = Session["Cases"] as IQueryable<CaseSearchResult>;
            }
            else
            {
                CaseLogic caseLogic = new CaseLogic();
                caseList = caseLogic.SearchCasesByCondition(new CaseSearchCondition()).AsQueryable();
            }
            var items = caseList.OrderBy(c => c.CaseId);
            var grid = this.gridMvcHelper.GetAjaxGrid(items);
            return PartialView("CaseSearchResult", grid);
        }

        [HttpGet]
        public ActionResult GridPager(int? page)
        {
            IQueryable<CaseSearchResult> caseList = Session["Cases"] as IQueryable<CaseSearchResult>;
            var items = caseList.OrderBy(o => o.CaseId);
            var grid = this.gridMvcHelper.GetAjaxGrid(items, page);
            object jsonData = this.gridMvcHelper.GetGridJsonData(grid, "CaseSearchResult", this);

            return Json(jsonData, JsonRequestBehavior.AllowGet);
        }     
    }
}

-------------Parent View (CaseSearch.cshtml--------------------------------

@model CaseManagement.Models.Entity.CaseSearchCondition
@{
    ViewBag.Title = "Case Search";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<h2>@ViewBag.Title</h2>
<div class="container">

    <form id="main-contact-form" class="contact-form" name="contact-form">
        <div class="col-sm-3">
            <div class="form-group">
                <label>Agent Name</label>
                @Html.TextBoxFor(m => m.AgentId, new { @class = "form-control" })
            </div>
            <div class="form-group">
                <label>Agent Phone Number</label>
                @Html.TextBoxFor(m => m.AgentPhoneNumber, new { @class = "form-control" })
            </div>
            <div class="form-group">
                <label>Case Number</label>
                @Html.TextBoxFor(m => m.CaseId, new { @class = "form-control" })
            </div>
        </div>
    <div class="col-lg-3 col-sm-4">
        <div class="form-group">
            <button type="button"  id="search" name="search" class="btn btn-primary btn-lg" onclick="OnSearch()">-- Search --</button>
        </div>
    </div>
</form>

    <div id="rData" data-source-url="@Url.Action("GridPager")">
        @{Html.RenderAction("GetGrid");}
    </div>
    <br/>
    <div class="col-sm-4">
        @Html.ActionLink("Export PDF", "CasePdfExport", "CaseSearch", null, new { @class = "btn btn-primary btn-md" })
        @Html.ActionLink("Export EXCEL", "CaseExcelExport", "CaseSearch", null, new { @class = "btn btn-primary btn-md" })
        @Html.ActionLink("Export CSV", "CaseCsvExport", "CaseSearch", null, new { @class = "btn btn-primary btn-md" })
    </div>
</div>

----------Javascripts ection -----------
    @section Scripts {
        @Scripts.Render("~/bundles/gridmvc");
        @Scripts.Render("~/bundles/application/case");

  (function () {
    var gridName = 'CaseSearchResultGrid';
    var pagingUrl = '/CaseSearch/GridPager';

    $('.grid-mvc').gridmvc();
    pageGrids[gridName].ajaxify({
        getData: pagingUrl,
        getPagedData: pagingUrl
    });
}());



function OnSearch() {
    var CaseParams = {
        AgentId: $("#AgentId").val(),
        AgentPhoneNumber: $("#AgentPhoneNumber").val(),
        CaseId: $("#CaseId").val(),
        CaseStatus: $("#CaseStatus").val(),
        CaseOpenDate: $("#CaseOpenDate").val(),
        CaseCloseDate: $("#CaseCloseDate").val(),
        MainCategory: $("#MainCategories").val(),
        SubCategory1: $("#SubCategory1").val(),
        SubCategory2: $("#SubCategory2").val(),
        CustomerId: $("#CustomerId").val(),
        EnquiryDetails: $("#EnquiryDetails").val(),
    }

    $.ajax({
        url: "/CaseSearch/CaseSearchResult",
        type: 'post',
        success: function (data) {
            $('#rData').html(data);
            $(".grid-mvc").gridmvc();
        },
        error: function (XMLHttpRequest, textStatus, errorThrown) {
            alert("Status: " + textStatus); alert("Error: " + errorThrown);
        },
        data: CaseParams
    });
}

-----------------PartialView (_CaseSearch.cshtml)---------------------

@using GridMvc.Html
@using GridMvc.Sorting
@model Grid.Mvc.Ajax.GridExtensions.AjaxGrid<CaseManagement.Models.Entity.CaseSearchResult>
@(
 Html.Grid(Model).Named("CaseSearchResultGrid")
        .Columns(columns =>
        {
            columns.Add(c => c.CustomerId).Titled("Customer ID")
     .Filterable(false).Sanitized(false).Encoded(false)
     .RenderValueAs(c => @Html.ActionLink(c.CustomerId, "CaseList", "Case", new { CustomerId = c.CustomerId }, null).ToHtmlString());
            columns.Add(c => c.CaseId).Titled("Case ID")
                .Filterable(false).Sanitized(false).Encoded(false)
                .RenderValueAs(c => @Html.ActionLink(c.CaseId, "CaseEdit", "Case", new { CaseId = c.CaseId }, null).ToHtmlString());
            columns.Add(c => c.AgentId).Titled("Agent ID").Filterable(true);
            columns.Add(c => c.CaseStatus).Titled("Case Status")
                .RenderValueAs(c => @CaseManagement.Models.StatusType.GetCaseStatusDisplayValue(c.CaseStatus)).Filterable(true);
            columns.Add(c => c.CaseOpenDate).Titled("Case Open Date").Filterable(false);
            columns.Add(c => c.CaseCloseDate).Titled("Case Close Date").Filterable(false);
            })
        .Sortable()
        .WithPaging(5))

-----Models -----

    public class CaseSearchCondition
    {
        public string AgentId { get; set; }
        public string AgentPhoneNumber { get; set; }

        public string CaseId { get; set; }
        public int CaseStatus { get; set; }
}

    public class CaseSearchResult
    {
        public string CustomerId { get; set; }
        public string CaseId { get; set; }
        public string AgentId { get; set; }
        public int CaseStatus { get; set; }
        public DateTime CaseOpenDate { get; set; }
        public DateTime? CaseCloseDate { get; set; }
    }

Related posts

Recent Viewed