ASP.NET MVC 3.0 Razor 学习笔记之三

  ASP.NET MVC 3.0 Razor  和 ASP.NET 2.0 的 Razor 使用jquery 验证差别不是很大，2.0 是我们自己在页面写的ID ，3.0  Razor 自动使用我们的属性值作为ID。

  继续昨天的学习，在页面引用jqeury类库，在Scripts文件夹里面有。

 <script src="@Url.Content("~/Scripts/jquery-1.4.4.min.js")" type="text/javascript"></script>

  然后注释我们后台的ajax 验证，如果是DataTime类型，MVC 框架会强制的验证，不管你是否在属性上面贴了 [Required]

 

    public class News
    {
        //[Required]
        [Display(Name = "公告名称")]
        public string NewsName { get; set; }

        // [Required]
        [Display(Name = "创建时间")]
        public DateTime CreateDate { get; set; }

        // [Required]
        [Display(Name = "公告类型")]
        public string NewsType { get; set; }

        // [Required]
        [Display(Name = "公告类容")]
        public string Content { get; set; }
    }

 

   然后我们在View 里面写jqeury 代码来验证，建立一个newsvalidate.js

$(document).ready(function () {


    $("#submit").click(function () {



        if ($("#NewsName").attr("value") == "" || $("#CreateDate").attr("value") == "") {

            if ($("#NewsName").attr("value") == "") {
                alert("消息名称不能为空");
            }
            if ($("#CreateDate").attr("value") == "") {
                alert("创建时间不能为空");
            }

        }
    })
});

 页面引用 ：

<script src="@Url.Content("~/Scripts/newsvalidate.js")" type="text/javascript"></script>

@model RazorApplication.Models.News
<script src="@Url.Content("~/Scripts/jquery-1.4.4.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/newsvalidate.js")" type="text/javascript"></script>


@using (Html.BeginForm())
{
    @Html.ValidationSummary(true)
    <fieldset>
        <legend>News</legend>
        <div class="editor-label">
            @Html.LabelFor(model => model.NewsName)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.NewsName)
            @Html.ValidationMessageFor(model => model.NewsName)
        </div>
        <div class="editor-label">
            @Html.LabelFor(model => model.CreateDate)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.CreateDate)
           
        </div>
        <div class="editor-label">
            @Html.LabelFor(model => model.NewsType)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.NewsType)
            @Html.ValidationMessageFor(model => model.NewsType)
        </div>
        <div class="editor-label">
            @Html.LabelFor(model => model.Content)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Content)
            @Html.ValidationMessageFor(model => model.Content)
        </div>
        <p>
            <input id="submit" type="submit" value="Create" />
        </p>
    </fieldset>
    
    

}

然后验证结果：

 后面继续补充，json 的应用！