当modelsate无效时，如何在同一div上显示partialview以及错误消息 [英] How to display partialview on same div along with error msg when modelsate is invalid
问题描述
我是MVC新手，请帮助解决以下问题。
我创建了部分视图，其中包含很少的字段控件。
在索引页面上，我显示员工列表，并在div控件中呈现局部视图。
但是当我说在没有输入任何值的情况下提交部分视图，显然
ModelState.IsValid
由于必填字段，
将是假的，但我不能无法显示带有验证错误消息的相同索引页面。而不是那样，它打开一个新选项卡并显示部分视图页面以及验证错误消息。
如何显示相同的索引页面使用验证错误消息而不使用新标签。
员工类：
public int EmployeeID {获得; set ; }
[显示（名称= 名称）]
[必填（ ErrorMessage = 请输入员工姓名。）]
public string EmployeeName { get ; set ; }
[范围（ 20 ， 60 ）]
public int 年龄{ get ; set ; }
public int 性别{ get ; set ; }
局部视图：
@ using（Html.BeginForm（ 保存， 员工，FormMethod.Post， new {id = displayer}））
{
@ Html.ValidationSummary（ true ）
@ Html.HiddenFor（model = > model.EmployeeID）
< div class = form-group >
@ Html.LabelFor（model = > model.EmployeeName， new {@class = control-label col-md-2}）
< div class = col-md-10 >
@ Html.EditorFor（model = > model.EmployeeName）
@ Html.ValidationMessageFor（model = > model.EmployeeName）
< / < span class =code-leadattribute> div >
< / div >
< div class = form-group >
@ Html.LabelFor（model = > model.Age， new {@class = control-label col-md-2}）
< div class = col-md-10 >
@ Html.EditorFor（model = > model.Age）
@ Html.ValidationMessageFor（model = > 模型。年龄）
< / div >
< / div >
< div class = form-group >
@ Html.LabelFor（model = > model.Gender， new {@class = control-label col-md-2}）
< div class = col-md-10 >
@ Html.EditorFor（model = > model.Gender）
@ Html.ValidationMessageFor（model = > model.Gender）
< / div >
< / div >
< div class = form-group >
< div class = col-md-offset-2 col-md-10 >
< input type = submit value = 保存 class = btn btn-default />
< / div >
< / div >
}
控制器动作：
[HttpPost]
public PartialViewResult保存（员工雇员）
{
if （ModelState.IsValid）
{
return PartialView（ 索引，_ employees）;
}
ModelState.AddModelError（ AddEmployee， 请输入所有必填字段。）;
return PartialView（ _ onPageEdit， new Employee（））;
}
索引页：
< a id =loadview>加载< / a>
< pre lang =HTML> < div id = displayer < span class =code-attribute> style = height：100px; width：400px; >
< / div >
$（' #loadview'）。点击（ function （）{
$ .ajax（{
type ：' POST'，
url：' @ Url.Content（〜/ Employee / Loads）'，
成功： function （数据）{
$（' #displaceyer'）。html（数据）
}，
错误： function （数据）{
alert（' 失败'）;
}
}）;
}）
我尝试过：
我试图在验证后使用Ajax无法实现相同的加载div。
$ （' #loadview'）。click（ function （）{
$ .ajax（{
type：' POST'，
url：' @ Url.Content（〜/ Employee / Loads）'，
成功： function （数据）{
$（' #displaceyer'）。html（data）
}，
错误： function （数据）{
alert（' 失败'）;
}
}）;
}）
（' #loadview'）。click（ function （）{
.ajax（{
类型：' POST'，
url：' @ Url.Content（〜/ Employee / Loads）'，
成功： function （data）{
（' #displayer'）。html（数据）
}，
错误：功能（数据）{
alert（ ' 失败'）;
}
}）;
} ）
我的尝试：
我试图加载d iv使用Ajax验证后无法实现相同的效果。
I'm new to MVC, please help on the below issue.
I have created Partial View which has few required field controls.
On the Index page, I'm showing employee list and also rendering the Partial View inside div control.
But when I say submit on the Partial View without entering any value, obviously
ModelState.IsValid
will be false due to required field, but I couldn't able to show the same Index page with validation error message. Instead of that, It's opening a new tab and showing partial view page along with validation error message.
How to show the same index page along with validation error messages without using new tab.
Employee Class:
public int EmployeeID { get; set; }
[Display(Name="Name")]
[Required(ErrorMessage="Please enter employee name.")]
public string EmployeeName { get; set; }
[Range(20, 60)]
public int Age { get; set; }
public int Gender { get; set; }
Partial View:
@using (Html.BeginForm("Save", "Employee", FormMethod.Post, new { id = "displayer" }))
{
@Html.ValidationSummary(true)
@Html.HiddenFor(model => model.EmployeeID)
<div class="form-group">
@Html.LabelFor(model => model.EmployeeName, new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.EmployeeName)
@Html.ValidationMessageFor(model => model.EmployeeName)
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.Age, new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.Age)
@Html.ValidationMessageFor(model => model.Age)
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.Gender, new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.Gender)
@Html.ValidationMessageFor(model => model.Gender)
</div>
</div>
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="submit" value="Save" class="btn btn-default" />
</div>
</div>
}
Controller Action:
[HttpPost]
public PartialViewResult Save(Employee employee)
{
if (ModelState.IsValid)
{
return PartialView("Index", _employees);
}
ModelState.AddModelError("AddEmployee", "Please enter all mandatory fields.");
return PartialView("_onPageEdit", new Employee());
}
Index Page:
<a id="loadview">Load</a>
<div id="displayer" style="height:100px; width:400px;">
</div>
$('#loadview').click(function () {
$.ajax({
type: 'POST',
url: '@Url.Content("~/Employee/Loads")',
success: function (data) {
$('#displayer').html(data)
},
error: function (data) {
alert('Failed');
}
});
})
What I have tried:
I have tried to load div by using Ajax not able to achieve the same after validation.
$('#loadview').click(function () {
$.ajax({
type: 'POST',
url: '@Url.Content("~/Employee/Loads")',
success: function (data) {
$('#displayer').html(data)
},
error: function (data) {
alert('Failed');
}
});
})('#loadview').click(function () {
.ajax({ type: 'POST', url: '@Url.Content("~/Employee/Loads")', success: function (data) {
('#displayer').html(data) }, error: function (data) { alert('Failed'); } }); })
What I have tried:
I have tried to load div by using Ajax not able to achieve the same after validation.
这篇关于当modelsate无效时，如何在同一div上显示partialview以及错误消息的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
