在我的模型中,我使用两个日期属性,开始日期和结束日期。我已将这两个属性映射到两个TextBoxFor文本框。当页面加载时,这两个日期是美国格式,但我希望它是英国格式。
@model UserManager.Models.vw_Group_Model
@{
ViewBag.Title = "Edit Group";
}
@using (Html.BeginForm())
{
@Html.ValidationSummary(true)
<div id="edit-user" style="padding:25px;">
<fieldset>
<legend>Edit group details</legend>
@* <div class="editor-label">
@Html.LabelFor(model => model.companyId)
</div>*@
@* <div class="editor-field">
@Html.EditorFor(model => model.companyId) - Non editable
@Html.ValidationMessageFor(model => model.companyId)
</div>*@
<div class="editor-label">
@Html.LabelFor(model => model.RowType)
</div>
<div class="editor-field">
@Html.TextBoxFor(model => model.RowType, new { @readonly = "readonly" }) - Non editable
@Html.ValidationMessageFor(model => model.RowType)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.groupName)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.groupName)
@Html.ValidationMessageFor(model => model.groupName)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.companyName)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.companyName) - Non editable
@Html.ValidationMessageFor(model => model.companyName)
</div>
@* <div id="hiddenSelection">
@Html.HiddenFor(model => model.selected_company, new { id = "hdnCompany" })
@Html.HiddenFor(model => model.selected_group, new { id = "hdnGroup" })
</div>*@
@*<fieldset style="width: 400px; padding-left: 15px;">
<legend>New company</legend>
<div id="createuser-companysearch">
@{Html.RenderAction("_txtAutocompleteCompanySearch", "GroupManager");}
</div>
</fieldset>*@
@* <fieldset style="width: 400px; padding-left: 15px;">
<legend>New group</legend>
<div id="createuser-groupsearch">
@{Html.RenderAction("_txtGroupSearchForm", "GroupManager");}
</div>
</fieldset>*@
<div class="editor-label">
@Html.LabelFor(model => model.StartDate)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.StartDate)
@Html.ValidationMessageFor(model => model.StartDate)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.EndDate)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.EndDate)
@Html.ValidationMessageFor(model => model.EndDate)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.IsActive)
</div>
<div class="editor-field">
@Html.CheckBoxFor(model => model.IsActive)
@Html.ValidationMessageFor(model => model.IsActive)
</div>
<p>
<input type="submit" value="Edit" />
</p>
@Html.ValidationSummary()
<br />
@Html.ActionLink("Back to Group Manager Dashboard", "Index")
</fieldset>
</div>
}
<script type="text/javascript">
$(document).ready(function () {
// chkSelection();
// Non editable fields grey
$("#oldCompanyName").css("background-color", "gray");
$("#oldGroupName").css("background-color", "gray");
$("#RowType").css("background-color", "gray");
// Assume group name already exists based on it being a value loaded from model
var valueCompany = $("#oldCompanyName").val();
// $("#hdnCompany").val(valueCompany);
$('#selected_company').val(valueCompany);
var valueGroup = $("#oldGroupName").val();
// $("#hdnGroup").val(valueGroup);
// $('#groupName').val(valueGroup);
$('#txtGroupnameExistsAlf').css("background-color", "#33ff00").val('ALF group does exist');
$('#txtGroupnameExistsBrad').css("background-color", "#33ff00").val('BRAD group does exist');
var rowType = $('#RowType').val();
if (rowType == "ALF") {
var company = $('#companyName').val();
$("#company_name").val(company);
$('#txtCompanynameExistsAlf').css("background-color", "#F7D358").val('Company does exist');
}
else {
var company = $('#companyName').val();
$("#company_name").val(company);
$('#txtCompanynameExistsBrad').css("background-color", "#F7D358").val('Company does exist');
}
});
</script>
@*
$("#groupName").autocomplete({
source: function (request, response) {
$.ajax({
url: '@Url.Action("LookUpGroupName", "UserManager")',
dataType: "json",
data: {
featureClass: "P",
style: "full",
maxRows: 12,
value: request.term
},
success: function (data) {
response($.map(data, function (item) {
// alert(item.group);
return {
label: item.group,
value: item.group
} // end of return
})); // end of response
}, // end of success
error: function (jqXHR, textStatus, errorThrown) {
alert(textStatus);
} // end of error
}); // end of ajax
},
minLength: 2,
select: function (event, ui) { // Assign to hidden values to trigger onchange ajax call.
$.ajax({
url: '@Url.Action("GroupnameCheck", "UserManager")',
dataType: "json",
data: {
featureClass: "P",
style: "full",
maxRows: 12,
value: ui.item.label
},
success: function (data) {
$.each(data, function (index, value) {
if (index == "AlfGroup") {
$("#txtGroupnameExistsAlf").val(value);
if ($("#txtGroupnameExistsAlf").val() == "Alf Group doesn't exist.") {
$("#txtGroupnameExistsAlf").css("background-color", "red");
}
else {
$('#txtGroupnameExistsAlf').css("background-color", "#33ff00");
}
}
if (index == "BradGroup") {
$("#txtGroupnameExistsBrad").val(value);
if ($("#txtGroupnameExistsBrad").val() == "Brad Group doesn't exist.") {
$("#txtGroupnameExistsBrad").css("background-color", "red");
}
else {
$('#txtGroupnameExistsBrad').css("background-color", "#33ff00");
}
}
var selectedVal = $("#groupName").val();
$('#hdnGroup').val(selectedVal);
});
}, // end of success
error: function (jqXHR, textStatus, errorThrown) {
alert(textStatus);
} // end of error
}); // end of ajax
$('#hdnGroupAlf').val(ui.item.label);
$('#hdnGroupBrad').val(ui.item.label);
},
open: function () {
$(this).removeClass("ui-corner-all").addClass("ui-corner-top");
},
close: function () {
$(this).removeClass("ui-corner-top").addClass("ui-corner-all");
}
});
$("#selected_company").autocomplete({
source: function (request, response) {
$.ajax({
url: '@Url.Action("LookUpCompanyName", "GroupManager")',
dataType: "json",
data: {
featureClass: "P",
style: "full",
maxRows: 12,
value: request.term + ":" + $('#RowType').val()
},
success: function (data) {
response($.map(data, function (item) {
// alert(item.group);
return {
label: item.group,
value: item.group
} // end of return
})); // end of response
}, // end of success
error: function (jqXHR, textStatus, errorThrown) {
alert(textStatus);
} // end of error
}); // end of ajax
},
minLength: 2,
select: function (event, ui) { // Assign to hidden values to trigger onchange ajax call.
$('#hdnCompany').val(ui.item.label);
}
});
function chkSelection() {
if($('#RowType').text() == "ALF") {
$('#companyname-checker-brad').hide();
$('#groupname-checker-brad').hide();
}
else {
$('#companyname-checker-alf').hide();
$('#groupname-checker-alf').hide();
}
}*@
模型
[Required(ErrorMessage = "Start Date is a required field")]
//[Display(Name = "Start Date")]
//[DataType(DataType.Date)]
//[DisplayFormat(DataFormatString = "{0:dd/MM/yyyy}", ApplyFormatInEditMode = true)]
public DateTime StartDate { get; set; }
[Required(ErrorMessage = "End Date is a required field")]
//[Display(Name = "End Date")]
//[DataType(DataType.Date)]
//[DisplayFormat(DataFormatString = "{0:dd/MM/yyyy}", ApplyFormatInEditMode = true)]
public DateTime EndDate { get; set; }
目前,日期显示在页面上:
01/01/0001
任何人都知道如何改变这个?优选快速修复。感谢。
答案 0 :(得分:0)
我最后编写了这个javascript来拆分日期字符串,然后将其重新排列到我想要的状态。
function dateFormater() {
var date = $('#StartDate').val()
var arrDate = date.split("/");
$('#StartDate').val(arrDate[1] + "/" + arrDate[0] + "/" + arrDate[2]);
date, arrDate = null;
date = $('#EndDate').val()
arrDate = date.split("/");
$('#EndDate').val(arrDate[1] + "/" + arrDate[0] + "/" + arrDate[2]);
};