7

I found a similar question here but that do not work for my case. Please look at the screen shot below. When I render data in an Edit form, all data was set to the controls properly except the highlighted date field. When I inspect the element, I found that the value is there but for some reason it is not showing in the field.

Here is the code I used to set value into this date field. I tried both "yyyy-MM-dd" & "MM/dd/yyyy" format but none worked.

<td>Joining Date</td> <td> @{ if(Model.JoiningDate != null) { <input id="txtJoiningDate" type="date" style="width: 100%;" value="@String.Format("{0:MM/dd/yyyy}",Model.JoiningDate.Value)" /> } else { <input id="txtJoiningDate" type="date" style="width: 100%;" /> } } </td>

enter image description here

Edit
enter image description here

Improve this question

5 Answers 5

Reset to default
12

For Html5 input type="date" fields, the values must be specified in the format "yyyy-MM-dd". Once you set it in that format, you will see the value assigned on screen.

Improve this answer
Sign up to request clarification or add additional context in comments.

1 Comment

I applied this to my code-behind and it was the solution I was looking for :)
11

Why instead you just use html helper as shown :-

@Html.TextBox("txtJoiningDate", Model.JoiningDate.Value ,"{0:yyyy-MM-dd}",new{ @style="width:100%", type="date" })
Improve this answer

7 Comments

I tried replacing 'v' with 'V' too, but the result is same :(
if I go with the 1st option, will it be possible to get the value of this control (as the value can be changed by the user) using jquery? If yes, then how can I do that? AS of now, I am getting this value using jquery i.e. $("#txtJoiningDate").val() ; that is using an id for this control
@V.P.Verma...if you see in console..the html generated by first answer will be same as you have given in your question..don't worry about that..
MM/dd/yyyy format won't work. It has to be ISO format yyyy-mm-dd.
@Exception, yes, I have to change the format from "MM/dd/yyyy" to "yyyy-MM-dd". But thanks to both you and "Mrchief" for helping me :D
|
4

using Html helper

@Html.TextBox("txtJoiningDate", Model.JoiningDate.Value ,"{0:MM/dd/yyyy}")

In Model 

 [DataType(DataType.Date)] [DisplayFormat(ApplyFormatInEditMode = true, DataFormatString = "{0:yyyy-MM-dd}")] public Nullable<System.DateTime> JoiningDate{ get; set; }

This is works for me

Improve this answer

1 Comment

where you mentioned input type="date" ?
2

You sure you tried yyyy-MM-dd format? Check out this fiddle, works properly on Chrome

<input id="txtJoiningDate" type="date" style="width: 100%;" value="2010-12-25" /> -> works <input id="txtJoiningDate" type="date" style="width: 100%;" value="2010/12/25" /> -> will not work
Improve this answer

2 Comments

yes. Please look into the 2nd image in edit section. Even in Chrome, it is not showing properly.
I'm presuming your browser version is fairly recent. Other thing I can think of is maybe some other plugin/JS is interfering. Does the demo work for you?
1 
@Html.EditorFor(x => x.JoiningDate)

also in your model:

 [DisplayName("Joining date")] [DataType(DataType.Date)] [DisplayFormat(DataFormatString = "{0:MM/dd/yyyy}", ApplyFormatInEditMode = true)] public DateTime? JoiningDate { get; set; }
Improve this answer

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.