Asp.net mvc 5 cross browser date picker and time picker - asp.net-mvc

I programming in mvc5 and i have problem.
My model:
[DataType(DataType.Date)]
[Required(ErrorMessage = "Required")]
public System.DateTime Date { get; set; }
[DataType(DataType.Time)]
[Required(ErrorMessage = "Required")]
public System.DateTime Time { get; set; }
View:
<div class="form-group">
#Html.LabelFor(model => model.Date, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Date, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Date, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Time, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Time, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Time, "", new { #class = "text-danger" })
</div>
</div>
When I use Google chrome date picker and time picker displays correctly, but when I use mozilla firefox this is only a textbox.
How i can to generalize it? I want always to have date picker and time picker.

The default editor template uses the html input type 'date', which is probably not supported in firefox. We created a custom editor template which falls back to jquery date picker (choose whatever js date picker, there are lots) if the browser does not support the date input type.
You can test this feature using modernizr if you want.

Related

HiddenInput not working while render on view MVC 5

I have used HiddenInput(DisplayValue = false) like:
[HiddenInput(DisplayValue = false)]
[DisplayName("Updated By")]
public string Updatedby { get; set; }
but it's still rendering as EditorFor
<div class="form-group">
#Html.LabelFor(model => model.Updatedby, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Updatedby, new { htmlAttributes = new { #class = "form-control" } }) #Html.ValidationMessageFor(model => model.Updatedby, "", new { #class = "text-danger" })
</div>
</div>
I want to render it as hidden field. How can I do that? Thank you.
You can use
#Html.HiddenFor(m=>m.Updatedbynew ,new { #class = "form-control" })
for rendering a hidden model-binded field in DOM.

Recovery datetime value in the edit view

When i click in the edit view the datetime lost the value.
enter image description here
<div class="form-group">
#Html.LabelFor(model => model.DataNascimento, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.DataNascimento, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.DataNascimento, "", new { #class = "text-danger" })
</div>
</div>
I would like, when i click in the edit view the value of DataNascimento recive the value from the database.
I hope you guys can help me.
You must force the control to display to dd/mm/yyyy formatted date. to do this you need to format the date.decorate the date property in model as below
[DataType(DataType.Date)]
[DisplayFormat(DataFormatString = "{0:dd-MM-yyyy}", ApplyFormatInEditMode = true)]
public System.DateTime DataNascimento{ get; set; }
If you are using MVC5,this should work
#Html.EditorFor(model => model.DataNascimento, new {htmlAttributes = new {#Value = #Model.DataNascimento.ToString("dd-MM-yyyy") } })

How to change date in editor in MVC?

I have in model DateTime
public System.DateTime date_in { get; set; }
And this is its View:
<div class="form-group">
#Html.LabelFor(model => model.date_in, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.date_in, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.date_in, "", new { #class = "text-danger" })
</div>
</div>
when I just click the EditorFor() to change the date, It writes:
The field date_in must be a date.
all formats I tried to insert (with time and without and change the places of month and day) were wrong.
The individual way I
succeeded is when month value and day value smaller than 13
I have tried answers people answered on similar questions
like add globalization tag and custom binder
but nothing helped me.

I can not save date in MVC

I've this model which has a couple of columns and one of them is date, but on post I get nothing of date, only in case if I give it the value of DateTime.Now then it will save the current date but If had selected some other date in the datepicker it will not save that as it should, so How can I pass the date to the view model on post, I can pass all the date from dropdown and textboxes but date is no where to found. Here is the code
My view model
[Display(Name = "Requested Date")]
[DisplayFormat(DataFormatString = "{0:yyyy-MM-dd}", ApplyFormatInEditMode = true)]
[DataType(DataType.Date)]
public DateTime? RequestDate { get; set; }
[Display(Name = "Job Number")]
public string JobNo { get; set; }
Here is the Post Create method code
if (ModelState.IsValid)
{
var model = new PECEquipmentRequest()
{
ProjectId = pecEquipmentRequest.ProjectId,
JobNo = pecEquipmentRequest.JobNo,
RequestDate = pecEquipmentRequest.RequestDate
};
db.PECEquipmentRequests.Add(model);
db.SaveChanges();
}
and here is the my razor syntax
<div class="form-group">
#Html.LabelFor(model => model.RequestDate, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.RequestDate, new { htmlAttributes = new { #Value = DateTime.Now,#class = "form-control datepicker" } })
#Html.ValidationMessageFor(model => model.RequestDate, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.JobNo, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.JobNo, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.JobNo, "", new { #class = "text-danger" })
</div>
</div>
and here is the kendo date picker that I'm using
$(document).ready(function () {
$(".datepicker").kendoDatePicker();
});
You can parse the date to the required format in the server side.
DateTime.ParseExact(str, "yyyyMMddHHmmss", CultureInfo.InvariantCulture);

ASP.NET MVC 5 Scaffolding not creating elements for enum property

This is probably a newbie question, as I'm quite new to ASP.NET MVC 5. When I tell Visual Studio to add a View based on my ViewModel class, it completely skips properties defined like public EnumName? PropertyName { get; set; } and does not create any #Html.EditorFor calls for it.
However, if I manually add the call #Html.EditorFor(model => model.PropertyName, new { htmlAttributes = new { #class = "form-control" } }) I get exactly what I expect -- a dropdown which is empty by default. Should scaffolding not do this by itself?
My understanding is that this is supposed to be supported in the current version of ASP.NET MVC. Am I wrong about that, or am I missing something? Help or advice is greatly appreciated.
Thanks in advance!
These are the ASP.NET products installed:
ASP.NET and Web Tools 12.4.51016.0
ASP.NET Web Frameworks and Tools 2012.2 4.1.21001.0
ASP.NET Web Frameworks and Tools 2013 5.2.21010.0
Edit for sample code:
Here is a small section of the view model. There are 170 different properties, almost all of them nullable-Enum type.
public partial class MedicalHistoryViewModel
{
public YesNo? Cancer { get; set; }
public MedicalHistoryDiagnosed? CancerDiagnosed { get; set; }
public YesNoUnsure? CancerIndustrialInOrigin { get; set; }
public YesNo? Diabetes { get; set; }
public MedicalHistoryDiagnosed? DiabetesDiagnosed { get; set; }
public YesNoUnsure? DiabetesIndustrialInOrigin { get; set; }
public YesNo? HeartDisease { get; set; }
//...
[Display(Name = #"Do you attribute the sleep disturbance to pain, anxiety and/or depression, or to other factors?")]
[DataType(DataType.MultilineText)]
public string SleepDisturbanceAttributedToComments { get; set; }
[Display(Name = #"Other (please specify)")]
[DataType(DataType.MultilineText)]
public string ParentsGrandparentsMedicalHistoryComments { get; set; }
}
Here is the complete output I get from Scaffolding. As you can see, it has completely ignored all enum properties.
#model QmeSurveyApp.ViewModels.MedicalHistoryViewModel
#{
ViewBag.Title = "EditMedicalHistory"; }
<h2>EditMedicalHistory</h2>
#using (Html.BeginForm()) {
#Html.AntiForgeryToken()
<div class="form-horizontal">
<h4>MedicalHistoryViewModel</h4>
<hr />
#Html.ValidationSummary(true, "", new { #class = "text-danger" })
<div class="form-group">
#Html.LabelFor(model => model.SleepDisturbanceAttributedToComments, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.SleepDisturbanceAttributedToComments, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.SleepDisturbanceAttributedToComments, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.SiblingsCousinsMedicalHistoryComments, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.SiblingsCousinsMedicalHistoryComments, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.SiblingsCousinsMedicalHistoryComments, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.ParentsGrandparentsMedicalHistoryComments, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.ParentsGrandparentsMedicalHistoryComments, new { htmlAttributes
= new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.ParentsGrandparentsMedicalHistoryComments, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="submit" value="Save" class="btn btn-default" />
</div>
</div>
</div> }
<div>
#Html.ActionLink("Back to List", "Index") </div>
#section Scripts {
#Scripts.Render("~/bundles/jqueryval") }
But, if I add this block manually, I get exactly what I want: a drop-down which is empty by default, with my full pick list as the choices.
<div class="form-group">
#Html.LabelFor(model => model.Cancer, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Cancer, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Cancer, "", new { #class = "text-danger" })
</div>
</div>
You don't mention it, but I'm guessing you're not using Entity Framework.
I had a similar situation in an MVC project I was working in without EF. I had a POCO with a property that was an enum, and it was being completely skipped by the scaffolding engine. I even tried overriding the T4 templates with my own CodeTemplates and that's when I noticed the ModelMetadata.Properties collection didn't even contain my enum property.
I finally got it to work just by adding an empty Code First Entity Data model to the project. Doing that adds the Data context class textbox to the Add View scaffold item, and the resulting scaffolded view now includes my enum properties. This seems like a bug to me.

Resources