0
我是MVC框架的新手,我需要您的支持才能成功。我有一個局部視圖,我需要在加載視圖時在彈出窗口中顯示局部視圖。請爲此建議我一個最佳解決方案。提前致謝。顯示部分視圖彈出窗口
我是MVC框架的新手,我需要您的支持才能成功。我有一個局部視圖,我需要在加載視圖時在彈出窗口中顯示局部視圖。請爲此建議我一個最佳解決方案。提前致謝。顯示部分視圖彈出窗口
你可以使用jQuery leanModal插件來做到這一點。 例如,你可以把你的部分觀點在div
標籤,如:
<div id="modal">
@Html.Partial("_Polling",Model)
</div>
JS:
$(function(){
$('#modal').leanModal({ top: 70, closeButton: ".modal_close, .btnClose" });
});
如果您正在使用jQuery UI的對話框,你可以做一些事情像下面。示例代碼將有兩個ActionResult方法。一個用於登錄頁面,另一個用於彈出視圖。
public class HomeController : Controller
{
public ActionResult Index()
{
return View();
}
public ActionResult PoupUp()
{
return View();
}
}
索引視圖
<script type="text/javascript" src="jquery/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="jquery/jquery-ui.js"></script>
<link rel="stylesheet" type="text/css" href="jquery/jquery-ui.css">
<script>
$(function() {
var iframe = $('<iframe frameborder="0" marginwidth="0" marginheight="0" allowfullscreen></iframe>');
var dialog = $("<div></div>").append(iframe).appendTo("body").dialog({
autoOpen: false,
modal: true,
resizable: false,
width: "auto",
height: "auto",
close: function() {
iframe.attr("src", "");
},
buttons: {
"Close": function() {
$(this).dialog("close");
}
}
});
$(".dialog").on("click", function (e) {
e.preventDefault();
var src = $(this).attr("href");
var title = $(this).attr("data-title");
var width = $(this).attr("data-width");
var height = $(this).attr("data-height");
iframe.attr({
width: +width,
height: +height,
src: src
});
dialog.dialog("option", "title", title).dialog("open");
});
});
</script>
<a target="_blank" href="PopUp.cshtml" class="dialog" data-title="Page Titl" data-width="550" data-height="410">Click here</a>
Popup.cshtml
@{
Layout = null;
}
Popup window.
你需要至少說明,在彈出的一些虛擬的內容...我的意思是獲取代碼,以顯示彈出,然後我們可以添加代碼以顯示其中的部分視圖 –
需要更多信息。你試過了什麼? – NaaN