1

我设法让 JQuery Modal 对话框显示出来,并在其中加载了一个局部视图:

var url = '@Url.Action("ShowCarDetail", "Car")?id=' + id;
            $('#dialog-modal').dialog(
                { 
                    title: "Car Detail", 
                    width: 600, 
                    height: 500,
                    draggable: false,
                    close: function (event, ui) {
                        $(this).dialog('close');
                    }

                });

            $('#dialog-modal').load(url, function() 
            {
                $(this).dialog('open'); 
            });

所以效果很好。问题是当对话框关闭时,我重新打开它,数据没有刷新。我在该部分视图上有一个 DateTime ,它告诉我这一点,因此将其放置几秒钟仍会显示旧值。

如何强制模式对话框正确加载(不使用可能已从先前请求呈现的旧 html)?

另外 - 如果部分视图有一些操作,如提交或其他操作,对话框是否仍会保持打开状态,还是会完全刷新页面?我希望能够拥有类似于 iframe 样式的模态对话框,其中在模态页面内发生的任何操作仍将存在并在页面没有完全刷新和对话框关闭的情况下进行更新。

谢谢

4

1 回答 1

3

关于你的问题:

另外 - 如果部分视图有一些操作,如提交或其他操作,对话框是否仍会保持打开状态,还是会完全刷新页面?我希望能够拥有类似于 iframe 样式的模态对话框,其中在模态页面内发生的任何操作仍将存在并在页面没有完全刷新和对话框关闭的情况下进行更新。

页面将以正常形式完全刷新。要实现您所描述的,请使用 ajax 表单,该表单向控制器方法发送帖子并返回部分视图。然后对 ajax 表单进行成功回调,它将用响应内容(将是从帖子返回的部分视图)替换 div 的内容(在打开的对话框中)。

简化示例...

看法:

<div id="dialog-modal">
    <p>Some optional static content here (within the dialog) 
    that should not change when the form is submitted.</p>
    <div id="dialog-content">
        @using (Html.BeginForm("MyAction", "MyController", null, FormMethod.Post, new { @id="MyForm" }))
        {
            @Html.EditorFor(x => x.Foo)
            <input type="submit" value="OK" />
        }
    </div>
</div>

控制器:

[HttpPost]
public ActionResult MyAction(MyModel model)
{
    // Do some stuff here with the model if you want
    MyNewModel newModel = new MyNewModel();
    return PartialView("_MyPartialView", newModel);
}

JavaScript:

$(function () {
    $('#MyForm').submit(function () {
        $.ajax({
            url: this.action,
            type: this.method,
            data: $(this).serialize(),
            success: function (xhr) {
                $('#dialog-content').html(xhr);
            }
        });
        return false;
    });
});

请注意,此实现将替换表单,因此您可以将表单放在需要替换的 div 之外,或者如果您希望在对话框中连续提交不同的表单,则可以在返回的部分视图中使用不同的表单。它可以灵活地根据您的需求进行调整。它也不会关闭对话框,直到你明确地调用它,或者影响被替换的 div 内容之外的任何内容。希望这可以帮助!

于 2013-09-18T22:21:07.113 回答