客户端不显眼验证MVC

时间:2015-08-19 09:38:50

标签: javascript jquery html asp.net-mvc asp.net-mvc-4

我正在创建一个基本的Web应用程序,在其中我创建了一个布局页面,由view" Default.cshtml"渲染两个部分视图,

1.ViewRight_Form   表格将学生详细信息提交给数据库

2.ViewRight_Display   显示存储在DB

中的所有记录

单击其各自的html输入,其中它们在div元素中呈现"#right"。我尝试在" ViewRight_Form"上应用客户端验证。使用DataAnnotations但尚未成功。页面没有显示验证错误,部分视图就消失了。请在此处寻求帮助。

1.Default.cshtml

@using TestApplication.Models
@model TestApplication.Models.Select

<script src="~/Scripts/jquery-1.10.2.js"></script>
<script src="~/Scripts/jquery.validate.min.js"></script>
<script src="~/Scripts/jquery.unobtrusive-ajax.min.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.min.js"></script>
<script type="text/javascript">




$(document).ready(function () {



    function Save1() {
        $.validator.unobtrusive.parse($("#right"));
        $("#right").load("/Default/Save1");

    };

    $("#Save").click(Save1);

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

    $("#right").load("/Default/Display");
    });

});


2.ViewRight_Form.cshtml

<link href="~/Content/ViewRight.css" rel="stylesheet" />
      @model TestApplication.Models.StudentTable


<script src="~/Scripts/jquery-1.10.2.js"></script>
<script src="~/Scripts/jquery.validate.min.js"></script>
<script src="~/Scripts/jquery.unobtrusive-ajax.min.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.min.js"></script>

    @using (Ajax.BeginForm("Save", "Default", new AjaxOptions { HttpMethod="POST" }))
 { 

    <div id="main">

        @Html.ValidationSummary(true)
        <h1>Right Partial View</h1>
        <ol>
            <li>
                <div class="label">
                    @Html.LabelFor(t => t.ID, "ID")
                </div>
                  @Html.TextBox("ID")
            </li>

            <li>
                <div class="label">
                    @Html.LabelFor(t => t.Name, "Name")
                </div>
                @Html.EditorFor(t => t.Name)
                @Html.ValidationMessageFor(t => t.Name)
                @*@Html.TextBox("Name")*@
            </li>

            <li>
                <div class="label">
                    @Html.LabelFor(t => t.Age, "Age")
                </div>
                @Html.TextBox("Age")
            </li>

            <li>
                <div class="label">
                    @Html.LabelFor(t => t.Contact_Number, "Contact Number")
                </div>
                @Html.TextBox("Contact_Number")

            <li>
                <div class="label">
                    @Html.LabelFor(t => t.Division, "Division")
                </div>
                @Html.TextBox("Division")
            </li>
        </ol>

        <input type="submit" value="Submit" />
    </div>

 }

3.Layout Page

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Test Application</title>
    @Styles.Render("~/Content/css")
    @Scripts.Render("~/bundles/modernizr")
    @Scripts.Render("~/bundles/jquery")
    @Scripts.Render("~/bundles/jqueryval")
    @Scripts.Render("~/bundles/bootstrap")
    <link href="~/Content/DefaultStyleSheet.css" rel="stylesheet" />


</head>
<body>

    <div class="header">
        @DateTime.Now.DayOfWeek    @DateTime.Now.ToString("H:mm:ss")
    </div>

    @RenderBody()



    @RenderSection("scripts", required: false)
</body>
</html>

4.Controller Action

 public ActionResult Save(StudentTable temp)
        {
            StudentDB object1 = new StudentDB();

            if (ModelState.IsValid)
            {
                object1.StudentRecord.Add(temp);
                object1.SaveChanges();
                return RedirectToAction("Default");
            }

            return RedirectToAction("Default");    

0 个答案:

没有答案