Remove time from MVC Razor Kendo Grid date column - razor

Question

How do i restrict the kendo datetime picker to allow only to select date ?
Currently a clock icon appears next to the Date picker, i don't want that.
The fields which ends with date are my date columns.
All the date fields are nullable date column (i.e DateTime?)
Can anyone point me right direction?
Here is my razor :
#(Html.Kendo().Grid(Model.employeedetailsList)
.Name("DependentGrid")
.Columns(columns =>
{
columns.ForeignKey(p => p.TitleCode, Model.TitleList, "TitleCode", "TitleDescription").Title("Title").Width(130);
columns.Bound(p => p.FirstName).Title("First Name");
columns.Bound(p => p.MiddleName).Title("Middle Name");
columns.Bound(p => p.LastName).Title("Last Name"); ;
columns.ForeignKey(p => p.Gender, Model.GenderList, "TitleCode", "TitleDescription").Title("Gender");
columns.ForeignKey(p => p.RelCode, Model.RelList, "RelCode", "RelName").Title("Rel");
columns.Bound(p => p.DepDOB).Format("{0:dd-MMM-yyyy}").Title("Date of Birth");
columns.Bound(p => p.RelStartDate).Format("{0:dd-MMM-yyyy}").Title("Rel Start Date");
columns.Bound(p => p.RelEndDate).Format("{0:dd-MMM-yyyy}").Title("Rel End Date");
columns.Bound(p => p.EmailAddress).Title("Email");
columns.Bound(p => p.DepPassportNumber).Title("Passport Number");
columns.Bound(p => p.DepPassportExpDate).Format("{0:dd-MMM-yyyy}").Title("Passport Expiry Date");
columns.Bound(p => p.RPNumber);
columns.Bound(p => p.RPIssueDate).Format("{0:dd-MMM-yyyy}").Title("RP Issue Date");
columns.Bound(p => p.RPExpDate).Format("{0:dd-MMM-yyyy}").Title("RP Expiry Dates");
})
.Sortable()
.Resizable(resize => resize.Columns(true))
.DataSource(dataSource => dataSource
.Ajax()
.Batch(true)
.ServerOperation(false)
.Model(model =>
{
model.Id(m => m.DependantDetialId);
})
.Update(update => update.Action("employeedetails_Update", "Mycontroller")
.Data("additionalData"))
.Create(create => create.Action("employeedetails_Create", "Mycontroller")
.Data("additionalData"))
.Destroy(delete => delete.Action("employeedetails_Destroy", "Mycontroller")
)
.Events(e => e.RequestEnd("DependentGrid_onComplete")
)
)
)

Answer 1

This was far easier, for me. If you're using MVC, in your model, you just tell it to use DataType.Date:
[DataType(DataType.Date)]
public DateTime RelStartDate{ get; set; }
You will need using System.ComponentModel.DataAnnotations; at the top of your page to include these tags.
Source: http://www.telerik.com/forums/remove-time-timepicker-from-grid

Answer 2

What I usually do when I only want the date and not the time is to create an Editor Template for that specific field.
Inside your view folder you create a new folder named EditorTemplates. In your case that might be /Views/Employees/EditorTemplates. Inside that folder you create a file named RelStartDate.cshtml which we'll use to display the DatePicker control.
In the new file you add the following lines:
#model DateTime?
#(Html.Kendo().DatePicker()
.Name("RelStartDate")
.Value(Model == null ? DateTime.Now.Date : ((DateTime)#Model).Date)
)
To use it you just have to write
columns.Bound(p => p.RelStartDate).EditorTemplateName("EmployeeDate");

Answer 3

A la propiedad del modelo tienes que poner una anotación ejemplo:
[UIHint("Date")]// o [DataType(DataType.Date)]
[Display(Name = "Fecha2")]
[DisplayFormat(ApplyFormatInEditMode = true, DataFormatString = " {0:MM/dd/yyyy}")]
public DateTime? fecHastaCuentaExenta { get; set; }