Question

对不起我的语言 - 用英语我只能阅读:)

我想在asp.net mvc做这样的事情：
1.向用户显示页面
2.打开模态对话框（jquery-ui）并显示局部视图
3.验证客户端的用户输入数据
4.如果可以，则验证服务器上的输入数据 5A。如果没关系那么我想重装页面 5B。如果有错误我想向用户显示它 6.用户可以随时用按钮关闭对话框
我有问题宽度5a和6.

在Firefox中，当我进行服务器验证并单击关闭按钮（对话框（'关闭'））时，我将重定向到调用验证数据的页面。如果我在对话框的标题中单击“x”，它就会关闭。在歌剧中，情况也是如此
另外在Firefox中我插入一个好的数据并在服务器传递对话框上验证时不要关闭（它在opera中工作）我没有mvc的丰富经验，也不知道我是否做得对。请查看我的代码并告诉我它是否错误，我不应该这样做。

控制器代码：

public ActionResult Create()<br/>
{
    return PartialView(new UserDTO());
}

[HttpPost]
public ActionResult Create(UserDTO model)
{
    if(model.Email != "fromasz@gmail.com")
    {
     ModelState.AddModelError("Email", "wrong email");
     return PartialView(model);
    }
 return new EmptyResult();
}

//索引页面上的javascript

<script type="text/javascript">
var dialog;

    $(document).ready(function () {
        dialog = $("#divInsert").dialog({
            title: "Insert",
            resizable: false,
            modal: true,
            autoOpen: false
        });

        $("#aShowInsert").click(function () {
            $("#divInsert").empty();
            $("#divInsert").load("Home/Create", function () {
                $("#inputCloseModal").click(function () {
                    dialog.dialog('close');
                    return false;
                });
            });

            dialog.dialog("open");
            return false;
        });
    });
</script>

<div id="divInsert" /> - its a dive where i loads form.
<a id="aShowInsert">add element</a> - link thats open dialog.

我按顺序导入js文件：jquery-1.6.1.js，jquery-ui-1.8.13.js，jquery.validate.js，jquery.validate.unobtrusive.js

表单视图如下所示：

// import js..
@using (Html.BeginForm())
{
@Html.ValidationSummary(true)
<div class="editor-label">
    @Html.LabelFor(model => model.Name)
</div>
<div class="editor-field">
    @Html.EditorFor(model => model.Name)
    @Html.ValidationMessageFor(model => model.Name)
</div>
<div class="editor-label">
    @Html.LabelFor(model => model.Surname)
</div>
<div class="editor-field">
    @Html.EditorFor(model => model.Surname)
    @Html.ValidationMessageFor(model => model.Surname)
</div>
<div class="editor-label">
    @Html.LabelFor(model => model.Email)
</div>
<div class="editor-field">
    @Html.EditorFor(model => model.Email)
    @Html.ValidationMessageFor(model => model.Email)
</div>
<p>
    <input type="submit" value="Create" id="inputSubmit" />
    <input type="submit" value="Close" id="inputCloseModal" />
</p>
}

<script type="text/javascript">
$("#inputSubmit").click(function (e) {
    e.preventDefault();
    var form = $("#divInsert form");
    form.validate();

    if (form.valid()) {
        $.ajax({
            url: "/Home/Create",
            data: form.serialize(),
            type: "POST",
            success: function (data) {
                if (data === "") {
                    location.reload();
                }
                else {
                    $("#divInsert").html(data);

                    $.validator.unobtrusive.parse($("#divInsert"));
                }
            }
        });
    }

    return false;
});

Answer 1

HEH。
这就是我喜欢编程的原因解决方案非常简单，我在这里发布，以避免其他人花一天时间搜索该bug 在我的解决方案中，当我重新加载对话框的内容时，我忘记将功能附加到按钮关闭。这就是在服务器验证重定向到此操作（主页/创建）后单击关闭按钮的原因。

$("#divInsert").html(data);
$.validator.unobtrusive.parse($("#divInsert"));

在此代码之后，我添加了此代码及其工作。

$("#inputCloseModal").click(function () {
    dialog.dialog('close');
    return false;
});

jquery对话框中的服务器端验证

1 个答案: