问题描述
我已经知道我正在制作一个MVC5网站。现在我刚刚使用Crete模板创建了一个具有BirthDate字段的视图。 Andit在IE中没有显示,并且在Chrome中显示了很多gliphs在文本框中,您可以在下面的图片中进行比较。发生了什么,如何让IE显示日期选择器与Chrome一样简单,以及如何克服它。
这是我如何在我的模型中定义该属性
[Display(Name =Fecha de nacimiento)]
[DataType(DataType.Date)]
[DisplayFormat(ApplyFormatInEditMode = true,DataFormatString ={0:MM / dd / yyyy})]
public DateTime BirthDate {get;组;
在查看
< div class =form-group>
@ Html.LabelFor(model => model.BirthDate,new {@class =control-label col-md-2})
< div class =col-md-10 >
@ Html.EditorFor(model => model.BirthDate)
@ Html.ValidationMessageFor(model => model.BirthDate)
< / div>
< / div>
如果你不喜欢内置的datepicker这是由浏览器呈现,因为它是输入type =date),那么有很多第三方插件可用,如 jQuery UI
有一件事你需要改变,而不是使用 EditorFor
,你可能需要使用 TextBoxFor
,因此浏览器只将其视为普通文本框。以下是使用jQuery UI的示例:
@ Html.TextBoxFor(m => m.BirthDate)
< script>
$(function(){
$('#BirthDate')。datepicker();
});
I´m making an MVC5 site, as you already know. And now I just created a View using Crete template that has a BirthDate Field. Andit is not showing in IE and shows horibly in Chrome with lots of gliphs inside the textbox as you can compare in the image below.
What is going on and how can I make IE to show a date picker just as easy as Chrome does, and how to clena it up a bit. Those levers I think are useless and confusing.
Here is how I defined that property in my model
[Display(Name = "Fecha de nacimiento")]
[DataType(DataType.Date)]
[DisplayFormat(ApplyFormatInEditMode = true, DataFormatString = "{0:MM/dd/yyyy}")]
public DateTime BirthDate { get; set; }
and in the View
<div class="form-group">
@Html.LabelFor(model => model.BirthDate, new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.BirthDate)
@Html.ValidationMessageFor(model => model.BirthDate)
</div>
</div>
If you don't like the built in datepicker (which is being rendered by the browser because it is input type="date"), then there are plenty of 3rd party plugins available such as jQuery UI.
One thing you will need to potentially change is instead of using EditorFor
you might need to use TextBoxFor
so the browser just treats it as a normal text box. Below is an example using jQuery UI:
@Html.TextBoxFor(m => m.BirthDate)
<script>
$(function() {
$('#BirthDate').datepicker();
});
这篇关于IE不为MVC5渲染DatePicker的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!