2

I am developing Mvc application. I used gridMvc version 2.0.0.0. when I am trying to filter date but it not working.When i am trying to select date from calender,date is not getting selected.

below is my code for view 

@model IEnumerable<StockWatch.DTO.EmployeeDTO>
@using GridMvc.Html
@using System.Web.UI.WebControls

@{
    ViewBag.Title = "Index";
}
<div class="row-fluid" style="margin-top:30px;margin-bottom:10px;margin-left:0px; margin-right:0px;">
    <div class="listheading span9">
        <div class="span2" style="font-size:22px;margin-right:5px;">
            Employees
        </div> 
    </div>
    <div class="createlink span3" style="text-align:right;margin-left:10px;">
        @Html.ActionLink("+ Add Employee", "Create")
    </div>
</div>

<div class="span12" style="margin-left:0px;margin-right:0px;">
        @Html.Grid(Model).Columns(columns => 
                    {
                        columns.Add(c => c.FirstName).Titled("First Name").SetWidth(400).Sortable(true).Filterable(true);
                        columns.Add(c => c.LastName).Titled("Last Name").SetWidth(900).Sortable(true).Filterable(true);
                        columns.Add(c => c.MobileNo).Titled("Mobile No.").SetWidth(400).Sortable(true).Filterable(true);
                        columns.Add(c => c.Email).Titled("Email").SetWidth(400).Sortable(true).Filterable(true);
                        columns.Add(c => c.LocationName).Titled("Location").SetWidth(800).Sortable(true).Filterable(true);
                        columns.Add(c => c.Designation).Titled("Designation").SetWidth(400).Sortable(true).Filterable(true);
                        columns.Add(c => c.JoiningDate).Titled("Joining<br/>Date").Format("{0:dd-MMM-yy}").SetWidth(400).Sortable(true).Filterable(true);  

</div>

How to do that? Thank you in advance.

sanjivani
  • 63
  • 1
  • 3
  • 9

4 Answers4

6

You need to add script and styles for it.

And your field datatype must be Datetime.

Scripts and style for Grid.MVC

<link href="@Url.Content("~/Content/Gridmvc.css")" rel="stylesheet" />
<link href="@Url.Content("~/Content/bootstrap.min.css")" rel="stylesheet" />
<script src="@Url.Content("~/Scripts/jquery-1.9.1.min.js")"></script>
<script src="@Url.Content("~/Scripts/gridmvc.min.js")"></script>

Scripts and style for Grid.Mvc datepicker

<script src="~/Scripts/bootstrap-datepicker.js"></script>
<link href="~/Content/gridmvc.datepicker.css" rel="stylesheet" />
<link href="~/Content/gridmvc.datepicker.min.css" rel="stylesheet" />
Saineshwar Bageri - MVP
  • 3,851
  • 7
  • 41
  • 47
0

You need update the gridmvc.js file.

Download it via the link below:

https://gridmvc.codeplex.com/SourceControl/latest

Then open project GirdMVC and copy gridmvc.js file again to your project.

Angel Politis
  • 10,955
  • 14
  • 48
  • 66
xmencute
  • 1
  • 2
0

I have been in this trouble for around a day. There is simplest solution. You have to add library of gridmvc date-picker.
Here is the shortest method.

PM> Install-Package Grid.Mvc.DatePicker

install this library from nuget console, then add a reference of this library into your view like this.

<script src="~/Scripts/bootstrap-datepicker.js"></script>

evrey thing will start working. There is one issue still unsolved, equal filter does not work. Greater and lessor work.

ref:https://gridmvc.codeplex.com/wikipage?title=Filtering

Muhammad Bashir
  • 179
  • 2
  • 2
  • 12
0

Convert in your action the datetime to date only.

It search for date with time 00:00:00, so if you send datetime it won't find.

It doesn't help to change the format to dd/MM/yy, you have to send it in this format in the model.

instead of sending

JoiningDate

send

JoiningDate.Date

in your model object.

sari
  • 1
  • 1