HTML5更改日期时间格式

Question

我在readonly文本框中显示日期时间值（type =＆＃34; text＆＃34;）并正确呈现。但是当我尝试保存它时，HTML5会突出显示文本框边框，我认为这意味着HTML5日期验证失败了。是因为格式？如果是，那么如何更改格式？如果可能的话，另一个选项可能是禁用默认的html5验证，但我很想知道它的行为。服务器端代码如下：

<div class="panel-body in">
<fieldset class="scheduler-border">
    <div class="form-group form-group-textarea">
        <div class="col-sm-4">
            @Html.LabelFor(m => m.LastUpdatedImage, new { @class = "control-label" })
        </div>
        <div class="col-sm-8">
            @Html.TextBoxFor(m => m.LastUpdatedImage, new { @class = "form-control", @readonly = "readonly" })
        </div>
    </div>
    <div class="form-group form-group-textarea">
        <div class="col-sm-4">
            @Html.LabelFor(m => m.LastUpdated, new { @class = "control-label" })
        </div>
        <div class="col-sm-8">
            @Html.TextBoxFor(m => m.LastUpdated, new { @class = "form-control", @readonly = "readonly" })
        </div>
    </div>
    <div class="form-group form-group-textarea">
        <div class="col-sm-4">
            @Html.LabelFor(m => m.LastPrinted, new { @class = "control-label" })
        </div>
        <div class="col-sm-8">
            @Html.TextBoxFor(m => m.LastPrinted, new { @class = "form-control", @readonly = "readonly" })
        </div>
    </div>
    <div class="form-group form-group-textarea">
        <div class="col-sm-4">
            @Html.LabelFor(m => m.LastExported, new { @class = "control-label" })
        </div>
        <div class="col-sm-8">
            @Html.TextBoxFor(m => m.LastExported, new { @class = "form-control", @readonly = "readonly" })
        </div>
    </div>
    <div class="form-group">
        <div class="col-sm-12">
            <input type="button" onclick="javascript:GetPropertySummaryDetails(@PropertyCode);" name="ShowSummary" id="ShowSummary" class="btn btn-primary" value="Export" />
        </div>
    </div>
</fieldset>

为其中一个文本框生成的html是：

<input class="form-control input-validation-error" data-val="true" data-val-date="The field Images Updated must be a date." data-val-required="The Images Updated field is required." id="LastUpdatedImage" name="LastUpdatedImage" readonly="readonly" type="text" value="21/05/2015 15:51:49">

图片如下：

Answer 1

首先，这不是与HTML5控件相关的问题。它与jquery.validate.js和jquery.validate.unobtrusive.js`相关，验证表单控件。如果页面上没有其他验证（例如在其他标签中），您可以删除这些文件，但正如您在评论中指出的那样，这可能不是一个选项。

另一种解决方案是使用隐藏输入（默认情况下，未验证隐藏输入），然后在DateTime元素内呈现<div>值，该元素的样式看起来像您的输入（边框等）

<div class="col-sm-8">
  @Html.HiddenFor(m => m.LastUpdatedImage)
  <div class="textbox">
    @Html.DisplayFor(m => m.LastUpdatedImage)
  </div>
</div>

然后根据textbox

的当前css为input[type="tetbox"]类添加css定义