MVC C#模式弹出窗口

好的,所以我想弄清楚如何根据这篇文章的建议,使用控制器为我的页面正确调用模态弹出窗口

ASP.NET MVC模式对话框/弹出窗口最佳实践

并且有点使用这个:

http://microsoftmentalist.com/2011/09/14/asp-net-mvc-13-open-window-or-modal-pop-up-and-fill-the-contents-of-it-from-the-控制器方法/

我有一个有下拉列表的视图,如果用户找不到他/她正在寻找的项目/值,他可以建议一个值(建议新值链接),该值应该调用控制器并返回一个弹出页面有几个领域。

这是视图上的对象:

 loadpopup = function () { window.showModalDialog('/NewValue/New′ , "loadPopUp", 'width=100,height=100′); }   model.ValueId, new selectlist........... %>  

我打算用来返回页面的控制器:

 public class NewValueController : Controller{ public Actionresult New(){ return View(); } } 

现在我被卡住了。 我想返回一个我可以格式化的页面,我是否必须返回一个字符串? 我不能返回一个aspx(我使用),因为格式化会更容易吗?

我非常感谢任何关于我应该去哪个方向的建议。

谢谢!

您可以使用jquery UI对话框进行弹出。 我们这里有一个小设置。

我们将有一个主窗体的视图模型:

 public class MyViewModel { public string ValueId { get; set; } public IEnumerable Values { get { return new[] { new SelectListItem { Value = "1", Text = "item 1" }, new SelectListItem { Value = "2", Text = "item 2" }, new SelectListItem { Value = "3", Text = "item 3" }, }; } } public string NewValue { get; set; } } 

控制器:

 public class HomeController : Controller { public ActionResult Index() { return View(new MyViewModel()); } [HttpPost] public ActionResult Index(MyViewModel model) { return Content("thanks for submitting"); } } 

和一个视图( ~/Views/Home/Index.aspx ):

 <%@ Page Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage" %>  <% using (Html.BeginForm()) { %> <%= Html.DropDownListFor(x => x.ValueId, Model.Values) %> 
<%= Html.EditorFor(x => x.NewValue) %> <%= Html.ActionLink("Suggest Value", "New", "NewValue", null, new { id = "new-value-link" }) %> <% } %>

然后我们可以照顾弹出窗口。 我们为它定义一个视图模型:

 public class NewValueViewModel { public string Foo { get; set; } public string Bar { get; set; } } 

控制器:

 public class NewValueController : Controller { public ActionResult New() { return PartialView(new NewValueViewModel()); } [HttpPost] public ActionResult New(NewValueViewModel model) { var newValue = string.Format("{0} - {1}", model.Foo, model.Bar); return Json(new { newValue = newValue }); } } 

和相应的局部视图( ~/Views/NewValue/New.ascx ):

 <%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl" %> <% using (Html.BeginForm(null, null, FormMethod.Post, new { id = "new-value-form" })) { %> <%= Html.EditorFor(x => x.Foo) %> <%= Html.EditorFor(x => x.Bar) %>  <% } %> 

现在剩下的就是编写一些javascript来连接所有内容。 我们包括jquery和jquery ui:

   

以及一个包含我们代码的自定义javascript文件:

 $(function () { $('#new-value-link').click(function () { var href = this.href; $('#dialog').dialog({ modal: true, open: function (event, ui) { $(this).load(href, function (result) { $('#new-value-form').submit(function () { $.ajax({ url: this.action, type: this.method, data: $(this).serialize(), success: function (json) { $('#dialog').dialog('close'); $('#NewValue').val(json.newValue); } }); return false; }); }); } }); return false; }); }); 
 $('#CheckGtd').click(function () { if ($(this).is(":checked")) $("#tbValuationDate").attr("disabled", false); else $("#tbValuationDate").attr("disabled", "disabled"); });