MVC C# modal açılan

Question

i

ASP.NET MVC modal dialog/popup best practice

ve tür kullandı düzgün bu yayının öneri uyarınca Kontrolörleri kullanarak Sayfam için kalıcı bir popup çağırmak anlamaya çalışıyorum yani Tamam:

http://microsoftmentalist.com/2011/09/14/asp-net-mvc-13-open-window-or-modal-pop-up-and-fill-the-contents-of-it-from-the-controller-method/

ben çekmek gerekiyor hangi kullanıcı o bir değer önerebilirsiniz için o/o aradığını/değer öğeyi bulamazsa (yeni değer bağlantısını önermek), DropDownList olan bir görünüme sahip controlle r ve içinde birkaç alan bulunan bir açılır sayfa döndür. görünümde

Here're nesneler:

<script type="text/javascript"> 

     loadpopup = function() 
     { 
window.showModalDialog(‘/NewValue/New′ , "loadPopUp", ‘width=100,height=100′); 
     } 

    </script> 


<%: Html.DropDownList(model => model.ValueId, new selectlist........... %> 
<%: Html.ActionLink("Suggest Value", "New", "NewValue", null, new { onclick = 'loadpopup()') %> 

Ben sayfasını dönmek için kullanmayı planlıyorum kontrolör:

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

Şimdi sıkıştım. Biçimlendirebileceğim bir sayfa döndürmek istedim, bir dizeye dönmek zorunda mıyım? biçimlendirmeyi kolaylaştıracağından, yerine bir aspx (kullanıyorum) kullanamaz mıyım?

Hangi yöne gitmem gerektiğine dair herhangi bir tavsiye çok takdir edilmektedir.

Teşekkürler!

Answer 1

Açılır pencere için jquery UI Dialog kullanabilirsiniz. Burada küçük bir ayar yapalım.

public class MyViewModel 
{ 
    public string ValueId { get; set; } 
    public IEnumerable<SelectListItem> 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; } 
} 

bir kontrolör:

public class HomeController : Controller 
{ 
    public ActionResult Index() 
    { 
     return View(new MyViewModel()); 
    } 

    [HttpPost] 
    public ActionResult Index(MyViewModel model) 
    { 
     return Content("thanks for submitting"); 
    } 
} 

ve bir görünüm (~/Views/Home/Index.aspx):

<%@ Page 
    Language="C#" 
    MasterPageFile="~/Views/Shared/Site.Master" 
    Inherits="System.Web.Mvc.ViewPage<AppName.Models.MyViewModel>" 
%> 

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server"> 

    <% using (Html.BeginForm()) { %> 
     <%= Html.DropDownListFor(x => x.ValueId, Model.Values) %> 
     <br/> 
     <%= Html.EditorFor(x => x.NewValue) %> 
     <%= Html.ActionLink("Suggest Value", "New", "NewValue", null, new { id = "new-value-link" }) %> 
     <button type="submit">OK</button> 
    <% } %> 

    <div id="dialog"></div> 

</asp:Content> 

o zaman geçirebilir

Biz ana form için bir görünüm modeli olurdu pop-up için bakım. Biz bunun için bir görünüştür modeli tanımlamak:

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

bir kontrol:

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 }); 
    } 
} 

ve karşılık gelen bir kısmi görünümü (~/Views/NewValue/New.ascx) kalan Şimdi

<%@ Control 
    Language="C#" 
    Inherits="System.Web.Mvc.ViewUserControl<AppName.Models.NewValueViewModel>" 
%> 

<% using (Html.BeginForm(null, null, FormMethod.Post, new { id = "new-value-form" })) { %> 
    <%= Html.EditorFor(x => x.Foo) %> 
    <%= Html.EditorFor(x => x.Bar) %> 
    <button type="submit">OK</button> 
<% } %> 

tüm biraz yazmak için javascript her şeyi tel. Bizim kodunu içerecek javascript dosyası

<script src="<%: Url.Content("~/Scripts/jquery-1.5.1.min.js") %>" type="text/javascript"></script> 
<script src="<%: Url.Content("~/Scripts/jquery-ui-1.8.11.js") %>" type="text/javascript"></script> 

ve özel bir: Biz Jquery ve jquery ui dahil

$(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; 
    }); 
}); 

Answer 2

$('#CheckGtd').click(function() { 
    if ($(this).is(":checked")) 
     $("#tbValuationDate").attr("disabled", false); 
    else 
     $("#tbValuationDate").attr("disabled", "disabled"); 
});