Question

我只需要一个验证的例子。对于剩下的我会做。假设我输入了文本类型：

 <p>                          
<label for="ClientName">ClientName:</label> <%= Html.TextBoxFor(model => model.Name)%>         
 </p>

这里我想验证所需字段的文本框。我想在JavaScript中使用这个必需的字段验证功能，我想在视图中使用这个脚本。

Answer 1

您是否考虑过使用不引人注目的验证？

你说你正在使用MVC3（虽然显然不是Razor视图引擎）。

使用以下代码：<p><label for="ClientName">ClientName:</label> <%= Html.TextBoxFor(model => model.Name)%></p> 这可以写成 Razor语法中的<p>@Html.LabelFor(model=>model.Name) @Html.TextBoxFor(model => model.Name) </p>。

如果你把它放在web.config中：

<appSettings>
    <add key="ClientValidationEnabled" value="true" />
    <add key="UnobtrusiveJavaScriptEnabled" value="true" />
</appSettings>

然后使用类似这样的数据注释来装饰模型中的属性：

[Display(Name = "Name")]
[Required(ErrorMessage = "Name is required")]
public string Name { get; set; }

然后将以下内容添加到_Layout.cshtml文件中，您将获得不显眼的验证工作：

<script src="@Url.Content("~/Scripts/jquery-1.7.1.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>

然后你可以在页面的某处添加它（你想要显示验证消息的地方）：@Html.ValidationMessageFor(model=>model.Name)

Answer 2

试试这个代码。在我这边工作你应该尝试：

 <form id="formname" post="" action="">
<ul>
<li>
 <input type="text" name="TimeArrived" id="TimeArrived" class="required" /></li>
 <li><input type="text" name="Name" id="Name" class="required"   />
</li>
 <li>
    <input type="button" name="Save" value="Save" onclick="return Submit();" /></li>
   </ul>
</form>

 $(document).ready(function () {
        var frm = $("#formname");
        frm.validate();
    });

 function Submit() {
  var f = $("#formname");

 if (f.valid())
{
}
}

Answer 3

现在<%= Html.TextBoxFor(model => model.Name)%>是关键，你应该为你想要使用验证的每个元素提供一个ID。

所以它看起来像;

<%= Html.TextBoxFor(model => model.Name,new { id="ClientNameTxt"})%>

如果您已经定义了一些脚本（.js文件）并希望实现此视图，那么请使用

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

并使用ur函数验证或编写新脚本

<script type="text/javascript">
    $(document).ready(function () {
        var frm = $("#formname");
        frm.validate();
    });

    $('#formname').Submit(function (event) {
        /* Call ur form with the id you have given */
        var f = $("#formname");

        if (f.valid()) {  /* When the form is valid */

        } else {  /* When the form is not valid */
            event.preventDefault(); /* Prevent from submitting the form */
            $("#ClientNameTxt").highlight(); /* Do some validation stuff on ur validation required element */
        }
    });
</script>

最后看起来像;

                 <!--Your form name, Controller name-->         
@using (Html.BeginForm("Formname", "ControllerName", FormMethod.Post,new { id="Formname", onkeypress="return event.keyCode != 13;"}))
{
    <p> 
        <label for="ClientName">ClientName:</label> <!--Give an ID to your element-->
        <%= Html.TextBoxFor(model => model.Name, new { id="ClientNameTxt" })%>
    </p>
}

<script type="text/javascript">
    $(document).ready(function () {
        var frm = $("#formname");
        frm.validate();
    });

    $('#formname').Submit(function (event) {
        /* Call ur form with the id you have given */
        var f = $("#formname");

        if (f.valid()) {  /* When the form is valid */

        } else {   /* When the form is not valid */
            event.preventDefault(); /* Prevent from submitting the form */
            $("#ClientNameTxt").highlight(); /* Do some validation stuff on ur validation required element */
            $("#Formname").append('<ul><li> Fill the empty areas and try again. <li><ul>');
            /* This is the worst i can do. Just to let you understand it easly. */
        }
    });
</script>

如果您仍然遇到此问题！我想你的解决方案就是用 - ＆gt;来训练你的自我。 jquery

使用javascript在MVC3中验证表单

3 个答案: