如何在 MVC 4 的同一视图中打开窗口？答案

【问题标题】：How to open window in the same View in MVC 4?如何在 MVC 4 的同一视图中打开窗口？
【发布时间】：2013-12-02 23:47:23
【问题描述】：

我的视图中有一个 Telerik MVC 网格，带有“下载”自定义按钮。此按钮重定向到我的下载操作，此下载操作将我重定向到下载视图，该视图以窗口模式显示一些图像。我想在同一页面中使用“下方”的网格打开此窗口。

我的代码：

c.Bound(column => column.IsStock);
    c.Bound(column => column.Version);
    c.Command(cmd => cmd.Custom("Download")
         .Text("Download")
         .DataRouteValues(d => { d.Add(k => k.IDDocument); d.Add(k => k.ReceivedDate); })
         .SendDataKeys(true)
         .Action("Download", "Administrative"));

行动：

 [Authorize(Roles = "Administrator, Employee")]
 public ActionResult Download(DocumentModel model)
 {
     var listUris = new List<string>();
     var uris = ServiceProxy.GetInstance().GetContainerUri(model.IDProtocol.ToString(), model.IDDocument.ToString()));
     foreach (var uri in uris)
     {
         listuris.Add(uri.AbsoluteUri);
     }
     ViewBag.uris = listUris;
     return View("Download");            
 }

下载视图：

@{
ViewBag.Title = "Imagens";
 }
@{
     Html.Telerik().Window()
    .Draggable(true)
    .Resizable(a => a.Enabled(true))
    .Scrollable(true).Width(700)
    .Name("ShowBarcode")
    .Modal(true)
    .Buttons(b => b.Close())
    .Content(@<text>
@using (Html.BeginForm())
{
    foreach (var uri in ViewBag.uris)
    {
    <img src="@uri" alt="IMAGE"/>
    <a href="@uri">@uri</a>
    }
}
   </text>).Render();
}

这很好用，但是当我单击下载按钮时我失去了我的网格。有什么建议？谢谢。

【问题讨论】：

听起来您要查找的内容似乎需要 JavaScript 并且可能需要 AJAX 调用才能从服务器中提取数据并填充数据面板。
@AdrianThompsonPhillips 真的吗？我认为这是一件简单的事情。类似于局部视图。
啊，我可能看错了，我以为你试图在不刷新页面的情况下显示选定的行。
我同意阿德里安的观点。将您的下载视图放入部分视图中，并使用 ajax 调用一个方法，该方法将使用单击的行中的数据为您生成部分视图。将该部分放入页面上的 div 中，然后使用 jquery 覆盖或对话框将其弹出到 div 上
@MattBodily 感谢您的回复，您能给我举个例子吗？

标签： c# asp.net-mvc asp.net-mvc-4 telerik

【解决方案1】：

所以你想在你的脚本标签中放一个 ajax 调用。确保您在页面上引用了 jquery。你打电话应该是这样的

$('#TableID tr').on('click', function() {
    $.ajax({
        url: "@(Url.Action("Action", "Controller"))",
        type: "POST",
        data: {
            id: $(this).attr('id')// from here http://stackoverflow.com/questions/5142422/get-id-of-selected-row-in-a-table-html
        }
        cache: false,
        async: true,
        success: function (result) {
            $(".Content").html(result);
            contentOverlay.load();
        }
    });
});

然后在你的控制器上

public PartialViewResult Action(string id){
    Model model = //query the database
    return PartialView("_PartialView", model);
}

因此，当单击一行时，将调用控制器上的方法并返回部分视图。将该结果放入视图中的 div 中，然后弹出该 div（我们使用 jquery 覆盖，但有几个不同的选项）。希望这会有所帮助

【讨论】：

我在 url: member 上看到一堆语法错误。 “@Url.Action”在这里有效吗？