Use DateTime inputs to filter linq in MVC controller and return to view

Question

Can anyone help me get started using two DateTime inputs in an asp.net MVC view to filter a LINQ to Entities query in my controller and return the resulting data through a viewmodel to the view?

Here's what I have so far, but I'm not sure where to go from here:

    public ActionResult Appointments(FormCollection formCollection)
    {
        DateTime startDate = DateTime.Today;
        DateTime stopDate = DateTime.Today;

        if(formCollection.Count > 0)
        {
            startDate = DateTime.Parse(formCollection["datePickerStart"].ToString());
            stopDate = DateTime.Parse(formCollection["datePickerStop"].ToString());
        }

        using (var db = new SalonContext())
        {
            var homeSalon = GetHomeSalonId();
            var appointments = db.Appointments.Include(c => c.Salon).Include(c => c.Treatment).Include(c => c.Customer).Where(c => c.SalonId == homeSalon).ToList();
            var reportAppointments = appointments.Where(d => d.Start >= startDate && d.Start <= stopDate).Select(
                report => new AppointmentReportViewModel()
                {
                    AppointmentID = report.AppointmentId,
                    AppointmentTime = report.Start,
                    Cancelled = report.Cancelled,
                    Completed = report.Completed,
                    CustomerName = report.Customer.Title + " " + report.Customer.FirstName + " " + report.Customer.Surname,
                    Price = report.Price,
                    Stylist = report.Stylist.Title + " " + report.Stylist.FirstName + " " + report.Stylist.Surname,
                    Treatment = report.Treatment.Name
                }).ToList();

            return View(reportAppointments);
        }
    }

And here's the view

@model IList<MySalonOrganiser.Models.AppointmentReportViewModel>

@{
    ViewBag.Title = "Appointments";
}

<h2>Appointments</h2>

@using (Html.BeginForm("Appointments", "Report"))
{
    @Html.AntiForgeryToken()

   <div>
       <div style="margin-top: 6px; margin-left: 180px">
           <span style="margin-right:20px;">Start Date</span>
           @(Html.Kendo().DatePicker()
              .Name("datepickerStart")
              .Value(DateTime.Today)
              .HtmlAttributes(new { style = "width:150px" })
           )
       </div>
       <div style="margin-top: 6px; margin-left: 180px">
           <span style="margin-right:20px;">Stop Date</span>
           @(Html.Kendo().DatePicker()
              .Name("datepickerStop")
              .Value(DateTime.Today)
              .HtmlAttributes(new { style = "width:150px" })
           )
       </div>

        <input type="Submit" value="Filter Report Dates" />
    </div>
}

<div style="margin-top:20px;">
    <table class="table">
        <tr>
            <th>
                Customer Name
            </th>
            <th>
                Appointment Time
            </th>
            <th>
                Treatment
            </th>
            <th>
                Stylist
            </th>
            <th>
                Price
            </th>
            <th>
                Completed
            </th>
            <th>
                Cancelled
            </th>
            <th></th>
        </tr>

        @for (var i = 0; i < Model.Count; i++)
        {
            <tr>
                <td>
                    @Html.DisplayFor(model => Model[i].CustomerName)
                </td>
                <td>
                    @Html.DisplayFor(model => Model[i].AppointmentTime)
                </td>
                <td>
                    @Html.DisplayFor(model => Model[i].Treatment)
                </td>
                <td>
                    @Html.DisplayFor(model => Model[i].Stylist)
                </td>
                <td>
                    @Html.DisplayFor(model => Model[i].Price)
                </td>
                <td>
                    @Html.CheckBoxFor(model => Model[i].Completed)
                </td>
                <td>
                    @Html.CheckBoxFor(model => Model[i].Cancelled)
                </td>
            </tr>
        }
    </table>
</div>

As you can see I am trying to use the Telerik DatePicker control.

However, the model in the view is IList so should I use ViewBag to send and receive this stuff or how would I get the datetime into the collection?

Many thanks.

Jason.

Answer 1

Use DatePicker for

@(Html.Kendo().DatePickerFor(x => x.FlightStartDate)
 .HtmlAttributes( new {id="startDate", style = "width:252px;"}))

On form submit, the DatePicker field will bind to the FlightStartDate property of my model.

And then in controller if you want to populate the field on page render.

    MyModelClass model = new MyModelClass();
    model.FlightStartDate = DateTime.Now();

    return View(model);

Here's how you could use Tuple for multiple Models.

         ViewModel model1 = new ViewModel();
         IList<Model2> model2 = new IList<Model2>();
          var tuple = new Tuple<ViewModel, IList<Model2>(model1, model2);

Then in your View

@model Tuple<ViewModel, IList<Model2>

Then your DatePickerFor would become

@(Html.Kendo().DatePickerFor(x => x.Item1.FlightStartDate)

Answer 2

//--Below code to filter list based on from and to Date
// ---From Date 
        <code>
            if (!string.IsNullOrEmpty(fromDate))
            {
                DemoList = DemoList.FindAll(x => Convert.ToDateTime(x.DemoRegistrationDate).Date >= Convert.ToDateTime(fromDate).Date);
            }
        </code>

// ---To Date 
       <code>
            if (!string.IsNullOrEmpty(toDate))
            {
                DemoList = DemoList.FindAll(x => Convert.ToDateTime(x.DemoRegistrationDate).Date <= Convert.ToDateTime(toDate).Date);
            }
        </code>