This project is read-only.

sorting column will cause lost of data

Sep 6, 2013 at 6:13 PM
Hi all,
I struggled with this issue for 4 hours.
I have a view:
@using GridMvc.Html
@model TeklaWebClientMVC.Models.MSDReportModel
@{
    ViewBag.Title = "ShowJobsBetweenDates";
    Layout = "~/Views/Shared/_report.cshtml";
}
<h2>
    Jobs in Date Range</h2>
<script type="text/javascript">
    $(function () {
        $("#fromDatepicker").datepicker();
        $("#toDatepicker").datepicker();
    });
</script>

@using (Html.BeginForm())
{
    @Html.ValidationSummary(true)

    <table>
        <tr>
            <th>
                From:
            </th>
            <th>
                @Html.TextBoxFor(model => model.FromDate, new { id = "fromDatepicker", type = "text", style ="margin-top:10px"})
            </th>
            <th>
                To:
            </th>
            <th>
                @Html.TextBoxFor(model => model.ToDate, new { id = "toDatepicker", type = "text", style = "margin-top:10px" })
            </th>
            <th>
                @*@Html.TextBox("getJobs",new{type="submit", value="Get Jobs", class="btn-success", id="getJobs"})*@

                <input type="submit" value="Get Jobs" class="btn-success" id="getJobs" />
            </th>
        </tr>
    </table>
    @Html.Grid(Model.LogsByDateRange()).Columns(columns =>
{
    columns.Add(c => c.ModelName).Titled("Model Name").Sortable(true).SetWidth(30);
    columns.Add(c => c.RequestedOn).Titled("Requested on").Sortable(true).SetWidth(50);
    columns.Add(c => c.ProcessStartedOn).Titled("Process Started on").Sortable(true).SetWidth(50);
    columns.Add(c => c.ProcessEndedOn).Titled("Process Ended on").Sortable(true).SetWidth(50);
    columns.Add(c => c.RunTime).Titled("Run Time (sec)").Sortable(true).SetWidth(20);
}).WithPaging(20)
}




I initialize FromDate and ToDate to current date in my model constructor:
      public MSDReportModel()
      {
         FromDate = new DateTime();
         FromDate = DateTime.Now;


         ToDate = new DateTime();
         ToDate = DateTime.Now;

         OrderNumberToLookup = string.Empty;
         ServerToLookup = string.Empty;
      }
My action in controller looks like this:
        public ActionResult ShowJobsBetweenDates(MSDReportModel m)
        {
           MSDReport = m;
           return View(m);
        }
my LogsByDateRange() function looks like this:
      public List<Log> LogsByDateRange()
      {
         return db.Logs.Where(l => l.RequestedOn >= FromDate && l.RequestedOn <= ToDate).ToList();
      }
it works when I click on "Get Jobs" button. But when I click on the column header to sort the data, it calls my action method, but I lost the date range. How do I make Grid.Mvc to pass the picked FromDate and ToDate to my model when I sort a column?

I tried setInitialFilter, but it does not do anything.

Thanks
Sep 9, 2013 at 4:13 AM
Hi, It happens because you use POST form method to filter your data. Using GET request (passing parameters through query string) to filter data - is more correct way. Try to change your form submit method.
Nov 19, 2013 at 8:04 PM
Edited Nov 19, 2013 at 8:05 PM
Sorry it's been a while, but I did change it to GET request and it work. I had to specify it a GET request. I did not change anything in controller and model. I post the working code here in case somebody has the same issue:
@using (Html.BeginForm("ShowJobsBetweenDates", "Report", FormMethod.Get))
{
    @Html.ValidationSummary(true)

    <table>
        <tr>
            <th>
                From:
            </th>
            <th>
                @Html.TextBoxFor(model => model.FromDate, new { id = "fromDatepicker", type = "text", style ="margin-top:10px"})
            </th>
            <th>
                To:
            </th>
            <th>
                @Html.TextBoxFor(model => model.ToDate, new { id = "toDatepicker", type = "text", style = "margin-top:10px" })
            </th>
            <th>
                @*@Html.TextBox("getJobs",new{type="submit", value="Get Jobs", class="btn-success", id="getJobs"})*@
                <input type="submit" value="Get Jobs" class="btn-success" id="getJobs"  />
            </th>
        </tr>
    </table>
    @Html.Grid(Model.LogsByDateRange()).Columns(columns =>
    {
        columns.Add(c => c.ModelName).Titled("Model Name").Sortable(true).SetWidth(30);
        columns.Add(c => c.RequestedOn).Titled("Requested on").Sortable(true).SetWidth(50);
        columns.Add(c => c.ProcessStartedOn).Titled("Process Started on").Sortable(true).SetWidth(50);
        columns.Add(c => c.ProcessEndedOn).Titled("Process Ended on").Sortable(true).SetWidth(50);
        columns.Add(c => c.RunTime).Titled("Run Time (sec)").Sortable(true).SetWidth(20);
    }).WithPaging(20)
}
Thanks Bukharin
Marked as answer by MsBugKiller on 11/19/2013 at 12:04 PM
Jun 2, 2014 at 12:42 PM
Edited Jun 2, 2014 at 12:43 PM
Thanks MsBugKiller & Bukharin for the solution. It worked perfectly.