在部分视图中创建的下拉列表在渲染时未在视图中正确验证

Question

我正在使用 MVC 创建项目。我有一个视图，用户可以在其中输入文本框和下拉列表中的所有数据。

那些文本框和下拉列表是在两个单独的局部视图中创建的，我将在一个视图中呈现这些局部视图。

我的问题是 textbxes 正在得到正确验证，但 即使我选择了值，下拉列表也没有得到验证。

当我只渲染一个显示文本框的局部视图时 控制转到相应的操作方法。但是当我渲染部分 查看下拉列表；它给了我验证错误，即使我 在下拉列表中选择值

我将发布我的代码。

请记住，我只发布了 sn-p 的代码，因为我的部分视图包含文本框和下拉列表的重复代码。

抱歉，sn-ps 的代码太长了！！

显示文本框的局部视图代码

@model PITCRoster.tblUser
<script src="~/Content/CustomScripts/DatePickers.js"></script>
<script src="~/Scripts/jquery.validate.min.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.min.js"></script>
    <fieldset>
        <legend>tblUser</legend>

        <div class="editor-label">
            @Html.LabelFor(model => model.FirstName)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.FirstName)
            @Html.ValidationMessageFor(model => model.FirstName)
        </div>
// many other textboxes.
      </fieldset>

用于显示下拉列表的局部视图的代码

@model PITCRoster.ViewModel.LookUpViewModel
<script src="~/Content/CustomScripts/DatePickers.js"></script>
<script src="~/Scripts/jquery.validate.min.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.min.js"></script>

@Html.LabelFor(m => m.SelectedLocation)
@Html.DropDownListFor(m => m.SelectedLocation, Model.LocationList, "-Please select-")
@Html.ValidationMessageFor(m => m.SelectedLocation)
//many other dropdownlists

我在其中渲染这两个部分视图的视图

@model PITCRoster.ViewModel.WrapperViewModel
@{
    ViewBag.Title = "Resources";
}
<script src="~/Content/PopUp.js"></script>
<script src="~/Scripts/jquery.validate.min.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.min.js"></script>
<h2>Resources</h2>
@{
    //Html.RenderPartial("_DisplayResources")
    Html.RenderPartial("_DisplayResources",Model.tblUser);
}


<div id="dialog">
    @using (Html.BeginForm("AddResource", "Resources", FormMethod.Post))
        {
            @Html.AntiForgeryToken()
            @Html.ValidationSummary(true)
            Html.RenderPartial("_CreateNewResource", new PITCRoster.tblUser());
           Html.RenderPartial("_LookUpDropDowns", Model.LookUpViewModel);
            <br />
            <input type="submit" value="Create" />
        }
</div>

这里的 WrapperViewModel 是一个 ViewModel 类，其中包含 properties 具有 呈现这些部分视图所需的数据。

这是 WrapperViewModel 的代码

public class WrapperViewModel
{
    //tblUser will be a property of class tblUser.
    public IEnumerable<tblUser> tblUser { get; set; }

    //It will contain property of class LookUpViewModel.
    public LookUpViewModel LookUpViewModel { get; set; }
}

所有文本框都来自tblUser类 所有 下拉列表 列表都来自 LookUpViewModel

类

这是我的 LookUpViewModel 类

 public class LookUpViewModel
    {
 [Display(Name = "Location")]
        [Required(ErrorMessage = "Please select a location")]
        public int SelectedLocation { get; set; }
  public SelectList LocationList { get; set; }
}

要了解这门课，请参考我的问题和解决方案 Stephen Muecke here

这是我在 LocationList

中填充数据的方式

 RosterManagementEntities rosterManagementContext = new RosterManagementEntities();
            // populate your select lists
            var locations = from o in rosterManagementContext.tblCurrentLocations select o;
            model.LocationList = new SelectList(locations, "LocationId", "Location");

这是我的 AddResource 的 Action 方法

  [HttpPost]
        public ActionResult AddResource(LookUpViewModel modelLookUp, tblUser tblUser)
        {
            Helpers.CopyLookUpViewModelTotblUser(modelLookUp, tblUser);
            return View(modelLookUp);
        }

编辑

为 DropDownListFor() 生成的 HTML：

<select name="SelectedLocation" id="SelectedLocation" data-val-required="Please select a location" data-val="true" data-val-number="The field Location must be a number." value="">

它还有<option value = "">

为 ValidationMessageFor() 生成的 HTML：

<span class="field-validation-valid" data-valmsg-replace="true" data-valmsg-for="SelectedLocation" value=""/>

谢谢你..

Answer 1

我已经复制了你的代码，我的工作正常，这就是我所做的

LookUpViewModel.cs

public class LookUpViewModel {
    [Display(Name = "Location")]
    [Required(ErrorMessage = "Please select a location")]
    public int SelectedLocation { get; set; }

    public SelectList LocationList { get; set; }
}

tblCurrentLocations.cs

public class tblCurrentLocations {
    public int LocationId { get; set; }
    public string Location {get;set;}
}

tblUser.cs

public class tblUser {
    [Display(Name = "First Name")]
    [Required(ErrorMessage = "First Name required")]
    public string FirstName {get; set;}
}

我在HomeControler 上使用了Index 方法来渲染初始的View

public ActionResult Index() {
        var locations = new List<tblCurrentLocations>();
        locations.Add(new tblCurrentLocations {LocationId = 1, Location = "A"});
        locations.Add(new tblCurrentLocations {LocationId = 2, Location = "B"});

        var model = new WrapperViewModel();
        model.LookUpViewModel = new LookUpViewModel() {
            LocationList = new SelectList(locations, "LocationId", "Location")
        };
        return View(model);
    }

_CreateNewResource.cshtml

@model WebApplication1.Models.tblUser

<fieldset>
<legend>tblUser</legend>

<div class="editor-label">
    @Html.LabelFor(model => model.FirstName)
</div>
<div class="editor-field">
    @Html.EditorFor(model => model.FirstName)
    @Html.ValidationMessageFor(model => model.FirstName)
</div>
// many other textboxes.

_LookUpDropDowns.cshtml

model WebApplication1.Models.LookUpViewModel

@Html.LabelFor(m => m.SelectedLocation)

@Html.DropDownListFor(m => m.SelectedLocation, Model.LocationList, "-Please select-")

@Html.ValidationMessageFor(m => m.SelectedLocation)

最后是渲染所有Partials的视图

@model WebApplication1.Models.WrapperViewModel
@{
    ViewBag.Title = "Resources";
}
<script src="~/Scripts/jquery-2.1.4.min.js"></script>
<script src="~/Scripts/jquery.validate.min.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.min.js"></script>
<h2>Resources</h2>

<div id="dialog">
@using (Html.BeginForm("AddResource", "Home", FormMethod.Post)) {
    @Html.AntiForgeryToken()
    @Html.ValidationSummary(true)
    Html.RenderPartial("_CreateNewResource", new WebApplication1.Models.tblUser());
    Html.RenderPartial("_LookUpDropDowns", Model.LookUpViewModel);
    <br />
    <input type="submit" value="Create" />
}

对于validation 和发布所选结果，这对我来说效果很好，您提到视图中的内容比您发布的内容要多，也许视图中的其他内容会造成麻烦。另请注意，我必须添加 <script src="~/Scripts/jquery-2.1.4.min.js"></script> 才能使验证生效，您已省略