Question

我试图在不使用AjaxActionLink的情况下在MVC中抛出一个对话框窗口。我在这个例子中使用了jquery ui 1.8.13。

请考虑以下摘要：

public class ModalViewModel
{
    public string Title { get; set; }
    public string Description { get; set; }
}

控制器：

private ActionResult GetVisitors(VisitorSearchViewModel model)
    {
        VisitorSearchResponse response =
            .... Omitted for brevity

        if (response.Success)
        {
            return View("VisitorList", response.Visitors.ToList());
        }
        else
        {
            return RedirectToAction("Error");
        }
    }

    public PartialViewResult Error()
    {
        return PartialView("Modal", 
                            new ModalViewModel() 
                            { 
                                Title = "Test Title", 
                                Description = "Test Description" 
                            });
    }

最后，Modal共享视图：

@model CraftTraxNG.Model.ViewModels.ModalViewModel

<script type="text/javascript">
$(document).ready(function () {
    $("#errorMessage").dialog(
        { autoOpen: true,
          title: '@Model.Title',
          width: 500,
          height: 100,
          modal: true,
          buttons:{ "OK": function () {
                        $(this).dialog("close"); }
          }
       });
    });

<div id="errorMessage" style="display:none;">
    @Model.Description
</div>

遇到错误时，会写出局部视图内容;即，它成功创建了具有适当样式的对话窗口。我的问题是我想渲染我目前正在观看的视图上的部分视图。我之前从未以这种方式使用它。截至目前，当它呈现部分视图时，我丢失了我当前所在视图的内容。

通常情况下，我可以使用AjaxActionLink，只需设置一个div标签，我希望对话框呈现给它，或者替换它，或者在之后等之前插入它。

在这种情况下，我正在前往服务并抓住响应服务器端，如果它不成功，我需要一种方法用这个局部视图替换常规视图上的一些div标签。

感谢任何帮助。

谢谢。

Answer 1

我遇到过这个问题，我还没有想出一个理想的解决方案。这就是我通常做的事情。

<a href="#" id="loadsContentOrError">Click Me</a>

$(function() {
    $("#loadsContentOrError").click(e){
        e.preventDefault();
        $.ajax({
            url: '<%: Url.Action("Error") %>',
            success: function(html) {
                html = $(html);
                if(html.find('.errorMessage').length > 0) {
                    $('#divToLoadContentTo").append(html);
                } else {
                    $('#divToLoadContentTo").html(html);
                }
            }
        });
    });
});

这非常粗糙，但它为你提供了一个很好的起点。

MVC - Jquery UI - 对话 - 问题

1 个答案: