验证不工作在动态@ Html.DropDownListFor

Question

我有一个下拉列表中的DepartmentID，根据DepartmentCategoryID中选择的内容填充，但是我可以; t如果它留空为验证工作。它工作或所有其他人，但这是不同的做法。

<div style="display: table-row;"> 
    <div class="div-label-text-mandatory" , style="display: table-cell"> 
    @Html.LabelFor(model => model.DepartmentCategoryID) 
    </div> 
    <div class="div-dropdown-menu" , style="display: table-cell"> 
    @Html.DropDownListFor(model => model.DepartmentCategoryID (SelectList)ViewBag.DepartmentCategory, "Please select a Staff category", new { @id = "txtDepCatID", @onchange = "javascript:GetCity(this.value);" }) 
    </div> 
    <div class="div-val-cell" , style="display: table-cell"> 
    @Html.ValidationMessageFor(model => model.DepartmentCategoryID, "", new { @class = "text-danger" }) 
    </div> 
</div>    

<div id="DepartmentDiv" style="display: none;"> 
    <div class="div-label-text-mandatory" , style="display: table-cell"></div> 
    <div class="div-dropdown-menu" , style="display: table-cell"> 
    @Html.LabelFor(model => model.DepartmentID): 
    <select id="txtDepartment" name="txtDepartmentID"></select> 
    </div> 
    <div class="div-val-cell" , style="display: table-cell"> 
    @Html.ValidationMessageFor(model => model.DepartmentID, "", new { @class = "text-danger" }) 
    </div> 
</div> 

我尝试添加一个隐藏的部分，我将设置在jQuery的，但这并不工作，要么 - 不知道是否隐藏了能有缺失的验证？

<div style="display: table-row;"> 
    <div class="div-label-text-mandatory" , style="display: table-cell"></div> 
    <div class="div-dropdown-menu" , style="display: table-cell"> 
     @Html.HiddenFor(model => model.DepartmentID) 
    </div> 
    <div class="div-val-cell" , style="display: table-cell"> 
     @Html.ValidationMessageFor(model => model.DepartmentID, "", new { @class = "text-danger" }) 
    </div> 
</div> 

jQuery来填充列表：

<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script> 
<script language="javascript" type="text/javascript"> 
    function GetCity(_GetSubDepartment) { 
     var procemessage = "<option value='0'> Please wait...</option>"; 
     $("#txtDepartment").html(procemessage).show(); 
     var url = "@Url.Content("~/Employee/_GetSubDepartment")"; 

     $.ajax({ 
      url: url, 
      data: { DepartmentCategoryID: _GetSubDepartment }, 
      cache: false, 
      type: "POST", 
      success: function (data) { 
       console.log("Data length: "+data.length) 
       if ((data.length) == 0) { 
        $('#DepartmentDiv').hide(); 
       } 
       if ((data.length) > 0) { 
        var markup = "<option value='0'>Select department</option>"; 
        for (var x = 0; x < data.length; x++) { 
         markup += "<option value=" + data[x].Value + ">" + data[x].Text + "</option>"; 
         $("#txtDepartment").html(markup).show(); 
         //$('#DepartmentDiv').css('display', 'table-row').animate("slow"); 
         $('#DepartmentDiv').css('display', 'table-row').show(); 
        } 

       } 
      }, 
      error: function (reponse) { 
       alert("error : " + reponse); 

      } 
     }); 

    } 
</script> 

模型

[DisplayName("Staff category")] 
[Required(AllowEmptyStrings = false, ErrorMessage = " * is mandatory")] 
public int DepartmentCategoryID { get; set; } 

[DisplayName("Departments")] 
[Required(AllowEmptyStrings = false, ErrorMessage = " * is mandatory")] 
public int DepartmentID { get; set; } 

控制器：

[HttpPost] 
public ActionResult _GetSubDepartment(int? DepartmentCategoryID) 
{ 
    ViewBag.Department = new SelectList(db.vwDimDepartments.Where(m => m.DepartmentCategoryID == DepartmentCategoryID).ToList(), "DepartmentID", "DepartmentName"); 

    return Json(ViewBag.Department); 
} 

是jQuery的标记这一点，因为填充列表和它来自于一个视图包？

有没有人有解决方案？

Answer 1

你加入第二下拉列表选择第一种方式

var markup = "<option value='0'>Select department</option>"; 

其中有0一个值，该值有效的typeof int所以绝不会有一个验证错误。将其更改为

var markup = "<option value=''>Select department</option>"; 

另外您手动创建的HTML第二<select>元素

<select id="txtDepartment" name="txtDepartmentID"></select> 

具有name属性，不涉及到你的模型。相反，使用

@Html.DropDownListFor(m => m.DepartmentID, Enumerable.Empty<SelectListItem>()) 

强烈绑定到你的模型，并调整自己的脚本，以便它引用$('#DepartmentID')（不$('#txtDepartment')）

旁注：

1. AllowEmptyStrings = false是毫无意义的类型int（和其无论如何，默认为 ），所以你可以删除它。
2. 你_GetSubDepartment()方法不应该返回 SelectList（你只是返回不必要的额外数据 降低性能。

相反，它应该是

[HttpGet] // Its a get, not a post (change the ajax option) 
public ActionResult _GetSubDepartment(int? DepartmentCategoryID) // The parameter should be int (not nullable) or test for null 
{ 
    var data = db.vwDimDepartments.Where(m => m.DepartmentCategoryID == DepartmentCategoryID).Select(d => new 
    { 
    Value = d.DepartmentID, 
    Text = d.DepartmentName 
    }; 
    return Json(data, JsonRequestBehavior.AllowGet); 
}