Jquery验证在ASP MVC中不起作用

时间:2017-10-13 12:58:19

标签: jquery asp.net-mvc asp.net-mvc-4 unobtrusive-validation

我正在尝试在我的ASP MVC项目中使用jquery验证,但验证似乎不起作用。我参考了jquery.validate.js文件,我也设置了无阻碍的javascript false,但是当按钮被点击时,我没有看到任何错误消息显示在我的表单中。目前规则仅适用于必填字段,但最终我计划使用更复杂的验证。

有什么建议我错过了吗?

这是我的设置:

BundleConfig.cs :     
bundles.Add(new ScriptBundle("~/bundles/jquery").Include("~/Scripts/jquery-{version}.js"));
bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include("~/Scripts/jquery.validate*"));

_Layout.cshtml
@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/jqueryval")

Model:
public class SearchViewModel
{
   public string FirstName {get; set;}
   public string LastName  {get; set;}
}


Search.cshtml
@using (Html.BeginForm("SearchClient", "Client", FormMethod.Post, new { id = "clientSearchForm", @class = "form-horizontal" }))
{
HtmlHelper.UnobtrusiveJavaScriptEnabled = false;
    <div class="row">
        <div class="col-sm-6">
            <div class="form-group">
                <label for="lblSid" class="control-label col-xs-5">First Name</label>
                <div class="col-xs-7">                    
                    @Html.EditorFor(model => model.FirstName, new { htmlAttributes = new { @class = "form-control" } })                    
                </div>
            </div>
        </div>
        <div class="col-sm-6">
            <div class="form-group">
                <label for="lblMinuteMissing" class="control-label col-xs-5">Last Name</label>
                <div class="col-xs-7">
                    @Html.EditorFor(model => model.LastName, new { htmlAttributes = new { @class = "form-control" } })
                </div>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-sm-6">
            <div class="form-group">
                <div class="col-xs-5">
                    <button type="button" id="btnSearch" class="btn btn-success"> <i class="fa fa-search" aria-hidden="true"></i>&nbsp;Search</button>
                </div>                
            </div>
        </div>
    </div><br /> 
}

<script type="text/javascript">
    $(document).ready(function () {
        $("#clientSearchForm").validate({            
            rules: {
                FirstName: {
                    required: true
                }
            },
            messages: {
                FirstName: {
                    required: 'Please enter FirstName'
                }
            }
        });
    });
</script>

Web.config:
<add key="ClientValidationEnabled" value="true" />
<add key="UnobtrusiveJavaScriptEnabled" value="true" />

0 个答案:

没有答案
相关问题