Reputation: 79
I'm facing problems trying to format DateTime and Numbers in ASP.NET MVC Core 2.0 App using Razor Tag Helpers.
Following the good practices I would like to specify data format at the data model related to the form view.
My Model
public class OrderFormModel
{
public bool IsEdit { get; set; }
[Display(Name = "Order Time: ")]
public DateTime ORDER_LOCAL_TIME { get; set; }
[Display(Name = "Order Qty (K): ")]
public int QUANTITY_K { get; set; }
The view:
<div class="form-group col-md-9">
<label asp-for="ORDER_LOCAL_TIME"></label>
<input asp-for="ORDER_LOCAL_TIME" class="form-control" />
<span asp-validation-for="ORDER_LOCAL_TIME" class="text-danger"></span>
</div>
<div class="form-group col-md-6">
<label asp-for="QUANTITY_K"></label>
<input asp-for="QUANTITY_K" min="1" class="form-control" style="text-align:right" />
<span asp-validation-for="QUANTITY_K" class="text-danger"></span>
</div>
The desired formats are
12/12/2017 12:23 (can be separated in to two fields as workaround)
1 000.145
I've been trying a lot of options but none of them works. For the number input, I would like when the user enters the value and leaves the input, the format to be applied.
I've been trying:
[DisplayFormat(DataFormatString = "{0:dd/MM/yyyy hh:mm}")]
(not applied at all)
[DisplayFormat(DataFormatString = "{0:N3}")]
(not applied at all)
[DataType(DataType.Time)]
(applied but seconds, milliseconds and AM/PM present)
[DataType(DataType.Date)]
(works for date only field)
Your help is highly appreciated. Thanks.
UPDATED
As Stephen Muecke noted [DisplayFormat] applies the format when the page is first rendered. Agree, thanks. I have initial values for ORDER_LOCAL_TIME and QUANTITY_K properties. DateTime = now for ORDER_LOCAL_TIME and 1000 for QUANTITY_K.
So for example on New Order Action I would like Form View to show formatted initial values for Date with Time (mm:ss only) and Quantity (with thousand separators). The problem is I can't achieve that.
As Stephen Muecke notices format applied when your in the browser and the user edits a value and leaves the input is another story. If I use Java Script function connected to the OnChange event of the QUANTITY input, I can format and try to return formatted number as text to the input. But in this case: << jquery.js:7592 The specified value "3 000" is not a valid number. The value must match to the following regular expression: -?(\d+|\d+.\d+|.\d+)([eE][-+]?\d+)? >>
Upvotes: 4
Views: 18760
Reputation: 407
.cshtml:
<input type="text" asp-for="Model.StartDate" class="form-control" data-provide="datepicker" data-date-autoclose="true" data-date-format="yyyy-mm-dd">
.cs:
[Display(Name = "Start Date")]
[DisplayFormat(ApplyFormatInEditMode = true, DataFormatString = "{0:yyyy-MM-dd}")]
public DateTime? StartDate { get; set; }
Upvotes: 2
Reputation: 51
I'm working in ASP.NET Core and have found a solution to this problem that puzzled me off and on for a week (and was not resolved to my satisfaction in any of the forums I found here or elsewhere.)
I did not want to edit the property in the model or in the controller because I wanted the whole date (with timestamp) to be stored in the database.
The solution was to pass @item.CreatedDate.Date.ToShortDateString()
in the view, now my desired format MM/DD/YYYY on the page where I want limited date information displayed. ("CreatedDate" is my property). Hope that clears up some headaches.
Upvotes: 3