加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 编程开发 > asp.Net > 正文

asp.net-mvc-3 – DropDownListFor Unobtrusive Validation Requ

发布时间:2020-12-15 21:04:46 所属栏目:asp.Net 来源:网络整理
导读:This Question是类似的,但接受的答案解决了服务器端,我对客户端解决方案感兴趣. 鉴于此ViewModel public class MyViewModel{ public string ID { get; set; } [Required(ErrorMessage = "I DEMAND YOU MAKE A CHOICE!")] [Display(Name = "Some Choice")] pu
This Question是类似的,但接受的答案解决了服务器端,我对客户端解决方案感兴趣.

鉴于此ViewModel

public class MyViewModel
{
    public string ID { get; set; }

    [Required(ErrorMessage = "I DEMAND YOU MAKE A CHOICE!")]
    [Display(Name = "Some Choice")]
    public int SomeChoice{ get; set; }   
    [Required(ErrorMessage = "I DEMAND YOU MAKE A CHOICE!")]
    [Display(Name = "Keyword")]
    public string Keyword { get; set; }    
}

和剃刀

<div>
@Html.LabelFor(model => model.SomeChoice,new { @class = "label" })
@Html.DropDownListFor(model => model.SomeChoice,(SelectList)ViewBag.SomeChoice,"Select...")
@Html.ValidationMessageFor(model => model.SomeChoice)
</div>

并假设ViewBag.SomeChoice包含一个选择的选择列表

渲染的html没有得到data-val =“true”data-val-required =“我要求你做出选择!”其中的属性如@ Html.EditorFor(model => model.Keyword)或@ Html.TextBoxFor将呈现.

为什么?

像这样添加一个class =“required”

@Html.DropDownListFor(model => model.SomeChoice,"Select...",new { @class = "required" })

它使用jQuery Validation类语义和块提交但不显示消息.我可以做这种事

@Html.DropDownListFor(model => model.SomeChoice,new Dictionary<string,object> { { "data-val","true" },{ "data-val-required","I DEMAND YOU MAKE A CHOICE!" } })

哪个会在那里放置正确的属性,并在提交时阻止并显示消息但不利用我在ViewModel上的RequiredAttribute ErrorMessage

那么有没有人写过DropDownListFor,其行为与其他HtmlHelpers在验证方面一样?

编辑
这是我的精确代码

在HomeController.cs中

public class MyViewModel
  {
    [Required(ErrorMessage = "I DEMAND YOU MAKE A CHOICE!")]
    [Display(Name = "Some Choice")]
    public int? SomeChoice { get; set; }
  }


    public ActionResult About()
    {
        var items = new[] { new SelectListItem { Text = "A",Value = "1" },new SelectListItem { Text = "B",Value = "2" },new SelectListItem { Text = "C",Value = "3" },};
        ViewBag.SomeChoice = new SelectList(items,"Value","Text");
        ViewData.Model = new MyViewModel {};
        return View();
    }

About.cshtml

@using Arc.Portal.Web.Host.Controllers
@model MyViewModel
<script src="@Url.Content("~/Scripts/jquery.validate.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.js")" type="text/javascript"></script>

@using (Html.BeginForm())
{
<div>
    @Html.LabelFor(model => model.SomeChoice)
    @Html.DropDownListFor(model => model.SomeChoice,"Select...")
    @Html.ValidationMessageFor(model => model.SomeChoice)
</div>

<button type="submit">OK</button>
}

这是渲染的代码

<form action="/Home/About" method="post">    <div>
    <label for="SomeChoice">Some Choice</label>
    <select id="SomeChoice" name="SomeChoice"><option value="">Select...</option>
<option value="1">A</option>
<option value="2">B</option>
<option value="3">C</option>
</select>
    <span class="field-validation-valid" data-valmsg-for="SomeChoice" data-valmsg-replace="true">    </span>
</div>
<button type="submit">OK</button>
</form>

它回发给我的控制器……这不应该发生

解决方法

只需在要绑定下拉列表的属性上使用可为空的整数,就可以在视图模型上使用:
[Required(ErrorMessage = "I DEMAND YOU MAKE A CHOICE!")]
[Display(Name = "Some Choice")]
public int? SomeChoice { get; set; }

另外,为了获得适当不引人注目的HTML5 data- *属性,下拉列表必须位于表单内:

@model MyViewModel
<script src="@Url.Content("~/Scripts/jquery.validate.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.js")" type="text/javascript"></script>

@using (Html.BeginForm())
{
    <div>
        @Html.LabelFor(model => model.SomeChoice,new { @class = "label" })
        @Html.DropDownListFor(
            model => model.SomeChoice,Model.ListOfChoices,"Select..."
        )
        @Html.ValidationMessageFor(model => model.SomeChoice)
    </div>

    <button type="submit">OK</button>
}

另外你会注意到我摆脱了ViewBag(我根本无法忍受)并用视图模型上的相应属性替换它,它将包含下拉列表的可能选项.

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读