MVC Ajax Beginform不执行客户端模型验证

时间:2015-09-12 22:25:29

标签: c# ajax asp.net-mvc client-side-validation ajaxform

我真的很感激这个问题上的任何帮助。

尝试使用客户端验证在MVC中创建一个简单的Ajax表单。 这是我到目前为止所做的。

@using (Ajax.BeginForm("CreateAsync", "Page", new AjaxOptions() { HttpMethod = "POST" , OnComplete= "", OnSuccess= "P3Functions.onCreateSuccess()" }))
{
    @Html.AntiForgeryToken()
    <div class="form-horizontal">
        @Html.Partial("~/Views/Shared/Partial/_createPageCore.cshtml", Model)
        <div class="form-group">
            <div class="col-md-offset-2 col-md-10">
                <input type="submit" value="Create" class="btn btn-default" />
                <input type="button" value="Close" class="btn btn-default" onclick="P3Functions.closeCreate()" />
            </div>
        </div>
    </div>
}

这是一个用表单内容加载局部视图的表单。 (我也尝试将代码直接插入页面。没有区别)

使用Ajax.ActionLink将此表单加载到div中。

    <div class="pageItem_control">
        @Ajax.ActionLink("Add New Page", "PartialCreate", new { controller = "Page" },
            new AjaxOptions
            {
                UpdateTargetId = "createFormDivId",
                InsertionMode = InsertionMode.Replace,
                HttpMethod = "GET"
            },
            new { @class = "btn btn-default", @onclick = "P3Functions.displayCreate()" })
    </div>

其他配置:

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

捆绑配置

        bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
                    "~/Scripts/jquery.validate.js", "~/Scripts/jquery.validate.unobtrusive.min.js"));

_Layout.cshtml

    @Scripts.Render("~/bundles/jquery")
    @Scripts.Render("~/bundles/bootstrap")
    @Scripts.Render("~/bundles/CustomScript")
    @Scripts.Render("~/bundles/jqueryval")

PageModel.cs

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

_createPageCore.cshtml

<h4>Create New Page</h4>
<hr />
@Html.ValidationSummary(true, "", new { @class = "text-danger" })
<div class="form-group">
    @Html.LabelFor(model => model.DisplayTitle, htmlAttributes: new { @class = "control-label col-md-2" })
    <div class="col-md-10">
        @Html.EditorFor(model => model.DisplayTitle, new { htmlAttributes = new { @class = "form-control" } })
        @Html.ValidationMessageFor(model => model.DisplayTitle, "", new { @class = "text-danger" })
    </div>
</div>

目前它没有任何客户端验证直接进入服务器。但是在服务器端ModelState无效。

任何想法或帮助将不胜感激。

1 个答案:

答案 0 :(得分:0)

对于有同样问题的人:

查看

var xmlhttp;
if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari
    xmlhttp = new XMLHttpRequest();
} else { // code for IE6, IE5
    xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
    document.getElementById("myDiv").innerHTML = xmlhttp.responseText;
}
    // As you can see I'm also spamming myself with alerts, but they also
    // just return blank.
    alert(xmlhttp.response);
}
xmlhttp.open("GET", "http://www.cl.cam.ac.uk/~mgk25/ucs/examples/UTF-8-demo.txt", true);
xmlhttp.send();

您正在加载表单内容的位置。这解析了新添加的DOM字段。