验证JQueryUI模态表单保持模型数据注释

时间:2013-04-24 20:10:43

标签: jquery validation asp.net-mvc-4 modal-dialog

我对Javascript和jQuery很新。

我正在遵循此线程中提出的代码:Validate JQuery UI modal form within another form in MVC 4使用Data Annotations验证创建模式表单。

它与验证工作正常,但是当我正确完成表单并尝试保存信息并关闭它时,它会保存,但对话框不会关闭并保持这种状态直到我刷新页面。

以下是我的表单编码方式:

@using (Ajax.BeginForm(new AjaxOptions { HttpMethod = "POST", UpdateTargetId ="editDialog", OnSuccess = "editSucces" }))
{        
    @Html.ValidationSummary(true)

    <fieldset>
        <legend>Editar Usuário</legend>

        <div class="display-field">
            @Html.EditorFor(model => model.IdUsuario, new { id = "idUsuario"})
        </div>

        Nome
        <div class="editor-field">
            @Html.EditorFor(model => model.Nome, new { id = "nomeUsuario"})
            <br />
            @Html.ValidationMessageFor(model => model.Nome)
        </div>

        E-mail / Login
        <div class="editor-field">
            @Html.EditorFor(model => model.Login, new { id = "loginUsuario"})
            <br />
            @Html.ValidationMessageFor(model => model.Login)
        </div>

        Senha
        <div class="editor-field">
            @Html.EditorFor(model => model.Senha, new { id = "senhaUsuario"})
            <br />
            @Html.ValidationMessageFor(model => model.Senha)
        </div>
        <p>
            <input type="submit" value="Confirmar" />
        </p>
    </fieldset>
<div>
    @Html.ActionLink("Cancelar", "Index")
</div>
 } 

这是我的控制器动作:

public ActionResult Edit(Usuario usuario, string confsenha)
{
        if (usuario.Senha == confsenha)
        {
            usuario.DataCadastro = DateTime.Now;

            if (ModelState.IsValid)
            {
                db.Entry(usuario).State = EntityState.Modified;
                db.SaveChanges();
                return RedirectToAction("Index");
            }
            if (Request.IsAjaxRequest())
            {
                return PartialView("_Edit", usuario);
            }
            return View(usuario);

        }
}

这是我的javascript电话:

$(function () {
$('.openDialog').click(function () {
    $.ajax({
        url: this.href,
        type: 'GET',
        cache: false,
        data: { idUsuario: $('#idUsuario').val() },
        success: function (result) {
            $('#result').html(result).dialog('open');
        }
    });
    return false;
});
$('#result').dialog({
    autoOpen: false,
    modal: true,
    closeOnEscape: false
});
});
function editSucces(result) {
if (result.value) {
    $('#result').dialog('close');        
    window.location.href = '/usuario/index';
} else {
    $('#result').html(result);
}
}

运行它,我看到它永远不会进入javascript代码的这一部分:

if (result.value) {
    $('#result').dialog('close');        
    window.location.href = '/usuario/index';
}

所以,它永远不会到达应该关闭对话框的部分。有谁知道为什么会这样?或者应该在result.value中传递什么?

谢谢,如果有人可以提供帮助。

1 个答案:

答案 0 :(得分:0)

修正了它。

只需将Json值返回到if (result.value)即可。很简单,虽然我不得不睡觉才能得到它&gt;。&lt;

以下是修复后的代码:

控制器:

            if (ModelState.IsValid)
            {
                db.Entry(usuario).State = EntityState.Modified;
                db.SaveChanges();
                if (Request.IsAjaxRequest())
                {
                    return Json(new { cadastro = true });
                }
                else
                {
                    return RedirectToAction("Index");
                }
            }

使用Javascript:

function editSucces(result) {
    if (result.cadastro) {
        $('#result').dialog('close');        
        window.location.href = '/usuario/index';
    } else{
        $('#result').html(result);
    }

}