1

我正在使用 VS2012 / C# / MVC 4。

我正在尝试在不刷新整个页面的情况下发布“联系我们”表单。一切都很好，如果我错过任何必填字段并且不会触发 OnSuccess，验证会在第一时间启动。在我成功发布表单（不缺少任何必填字段）后，即使验证失败（缺少必填字段），每个额外的帖子都会导致 OnSuccess 触发。红色感叹号显示正确，控制器“知道”它失败了，但 ajax OnSuccess 似乎不知道新的失败。

ContactUsForm.cshtml（部分视图）：

@model contactdemo.Models.ContactUsDetails

  <div id="formContainer">
    @using (Ajax.BeginForm("ContactUsForm", new AjaxOptions { UpdateTargetId = "formContainer", OnSuccess = "displaySuccess" }))
    {    
    <strong>Send To: </strong>
    <div>
        @Html.DevExpress().ComboBoxFor(model => model.ContactID,
            settings =>
            {
                settings.ShowModelErrors = true;
                settings.Width = System.Web.UI.WebControls.Unit.Percentage(100);
                settings.Name = "ContactID";
                settings.Properties.ValueField = "ContactID";
                settings.Properties.ValueType = typeof(int);
                settings.Properties.TextField = "ContactName";
                settings.ControlStyle.CssClass = "contactUsCombo";
        }).BindList(Session["Names"]).GetHtml()
    </div>
    <div>
        @Html.DevExpress().LabelFor(m => m.Subject).GetHtml()
        @Html.DevExpress().TextBoxFor(m => m.Subject, 
            settings =>
            {
                settings.ShowModelErrors = true;
                settings.Width = System.Web.UI.WebControls.Unit.Percentage(100);
                settings.ControlStyle.CssClass = "subjectText";
            }).GetHtml()
    </div>
    <div>
        @Html.DevExpress().LabelFor(m => m.Message).GetHtml()
        @Html.DevExpress().MemoFor(m => m.Message, 
            settings =>
            {
                settings.ShowModelErrors = true;
                settings.Height = 50;
                settings.Width = System.Web.UI.WebControls.Unit.Percentage(100);
                settings.ControlStyle.CssClass = "memoText";
            }).GetHtml()
    </div>
    <div>
        @Html.DevExpress().Button(
            settings =>
            {
                settings.Name = "btnSubmit";
                settings.Text = "Send Message";
                settings.UseSubmitBehavior = true;
                settings.ControlStyle.CssClass = "contactUsCombo";
            }).GetHtml()
    </div>       
}

HomeController.cs：

namespace contactdemo.Controllers
{
[OutputCacheAttribute(VaryByParam = "*", Duration = 1, NoStore = true)]
public class HomeController : Controller
{
    <snip...>

    [HttpGet]
    [OutputCache(Duration = 60, VaryByParam = "*")]
    public ActionResult ContactUsForm()
    {
        return PartialView(new ContactUsDetails());
    }

    [HttpPost]
    public ActionResult ContactUsForm(ContactUsDetails data)
    {
        if (ModelState.IsValid)
        {
            return PartialView(new ContactUsDetails());
        }
        else
        {
            return PartialView(data);
        }
    }   
}

索引.cshtml：

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

<script type="text/javascript">
function displaySuccess(result) {
    alert("Sent Successfully");
}
</script>
4

1 回答 1

2

确保在displaySuccess回调中将不显眼的验证处理程序重新附加到 DOM 中新添加的内容：

function displaySuccess(result) {
    $('#formContainer form').removeData('validator');
    $('#formContainer form').removeData('unobtrusiveValidation');
    $.validator.unobtrusive.parse('#formContainer form');

    alert('Sent Successfully');
}

您需要这样做的原因是因为您在 AJAX 回调之后使用新的部分刷新 DOM 的内容，并且不显眼的验证框架无法知道这些新元素，除非您告诉它。你也可以看看一个similar answer.

于 2013-02-05T22:11:21.227 回答