如何使用模型渲染局部視圖時關閉JQuery UI對話框

我在JQuery UI對話框中呈現局部視圖。取自Loading a partial view in jquery.dialog的示例。關閉按鈕不起作用，當你傳遞一個模型的局部視圖...有沒有人有解決方案讓它關閉對話框？（當沒有模型傳遞給局部視圖時，它工作正常）。另外，任何人都可以解釋爲什麼傳遞視圖模型時不起作用？如何使用模型渲染局部視圖時關閉JQuery UI對話框

查看：

<script type="text/javascript"> 
    $(function() {  
     $('#dialog').dialog({    
      width: 400,    
      resizable: false, 
      title: 'hi there', 
      modal: true, 
      open: function(event, ui) { 
       //Load the CreateAlbumPartial action which will return 
       // the partial view _CreateAlbumPartial 
       $(this).load("@Url.Action("CreateAlbumPartial")"); 
      }, 
      buttons: { 
       "Close": function() { 
        $(this).dialog("close"); 
       } 
      } 
     });     
    }); 
</script> 

<div id="dialog" title="Create Album" style="overflow: hidden;"></div>

操作：

public ActionResult CreateAlbumPartial() 
     {     
     var applications = new List<string>{"bob", "john", "andrew"};   
     var selectList = applications.Select(x => new SelectListItem{Text = x,Value = x}).ToList(); 
     var model = new TestModel{Applications = selectList}; 
     return View("_CreateAlbumPartial", model); 
     }

視圖模型：

public class TestModel 
    {  
     public int SelectedApplicationId; 
     public IEnumerable<SelectListItem> Applications; 
    }

管窺：

@model MvcApplication1.Models.TestModel 

<div> 

@Html.DropDownListFor(
     x => x.SelectedApplicationId, 
     new SelectList(Model.Applications, "Value", "Text"), 
     "-- Select Application --", 
      new 
      { 
       id = "ApplicationsDropdownList", 
       data_url = Url.Action("ViewRolesForApplication", "Index") 
      } 
    ) 
</div>

來源

2012-04-12 woggles

woggles，看看這篇文章：http://ricardocovo.com/2011/04/03/asp-mvc3-editing-records-with-jqueryui-dialogs-and -ajaxforms /，它解釋了你正在尋找的東西。 - 原文在aspx上，但也有剃鬚刀版本。 – covo 2012-04-12 13:29:18

@covo偉大的職位......我將不得不作出很多更改才能使用我當前的代碼。我會讓你知道它是如何工作的。 – woggles 2012-04-12 14:34:21

@covo Ive關注了你的博客文章，它適用於簡單的編輯場景。然而，在我的情況下，我的對話框需要有一個下拉列表，當選擇了某些東西時，它會用複選框列表呈現另一個局部視圖。在這種情況下，關閉按鈕不再工作。您是否可以爲更復雜的表單提供優雅的解決方案 - 可能包含部分視圖？ – woggles 2012-04-23 15:27:30

第一次加載的內容，然後創建對話框

$(function() {  
     $.ajax({ 
      url: "@Url.Action("CreateAlbumPartial")", 
      success:function(data){ 
        $('#dialog').html(data).dialog({    
         width: 400,    
         resizable: false, 
         title: 'hi there', 
         modal: true, 
         buttons: { 
          "Close": function() { 
          $(this).dialog("close"); 
          } 
         } 
        }); 
      } 
     }); 

    });

來源

2012-04-12 11:18:28 Yorgo

如何使用模型渲染局部視圖時關閉JQuery UI對話框

回答

相關問題