在ASP.Net中動態渲染局部視圖MVC3使用Ajax調用動作的Razor

我試圖創建一個單獨的頁面窗體來創建「工作項目」。其中一個屬性是「工作項類型」的下拉菜單。在ASP.Net中動態渲染局部視圖MVC3使用Ajax調用動作的Razor

根據工作項類型，用戶可能需要在名稱 - 值對樣式屬性網格（屬性表）中提供附加信息。

我想動態呈現屬性表，只要選擇或更改工作項類型。一旦用戶提供了所有信息，他將點擊提交來創建「工作項目」。

這是我到目前爲止有：

@using (Ajax.BeginForm("AttributeData", new AjaxOptions() { UpdateTargetId="AttributeDataCell" })) 
{ 

     <div style="float:left"> 

@{ 
    Html.RenderPartial("CreateWorkItemPartialView"); 
} 
</div>  

<div id="AttributeDataCell" style="float:right"> 
    @Html.Action("AttributeData", new {id = 1}) 
</div> 
}

控制器中AttributeData行動只是呈現局部視圖：

public ActionResult AttributeData(int id = 0) 
{ 
    var attributes = _workItemDataService.ListWorkItemTypeAttributes(id); 
    return PartialView("EditWorkItemAttributesPartialView", attributes); 

}

現在，我想這個掛鉤到掇下拉列表的選擇事件，以便在每次選擇更改時在上述表單元格中重新呈現局部視圖。我想傳入所選的值作爲id。

一種方法是強制表單提交自己（並因此重新呈現）。

如果這是正確的方法，我們該怎麼做呢？特別是，我們如何只做屬性表來重新渲染？
如果有更好的方法來實現上述，請註明。

感謝

來源

2011-11-17 Raza Ali

你可以訂閱.change()事件的下拉列表中，並觸發一個AJAX請求：

$(function() { 
    $('#Id_Of_Your_Drop_Down').change(function() { 
     // This event will be triggered when the dropdown list selection changes 

     // We start by fetching the form element. Note that if you have 
     // multiple forms on the page it would be better to provide it 
     // an unique id in the Ajax.BeginForm helper and then use id selector: 
     var form = $('form'); 

     // finally we send the AJAX request: 
     $.ajax({ 
      url: form.attr('action'), 
      type: form.attr('method'), 
      data: form.serialize(), 
      success: function(result) { 
       // The AJAX request succeeded and the result variable 
       // will contain the partial HTML returned by the action 
       // we inject it into the div: 
       $('#AttributeDataCell').html(result); 
      } 
     }); 
    }); 
});

來源

2011-11-17 09:00:21

感謝。如何從下拉列表中獲取選定的項目值？而不是form.serialize，也許我們可以傳遞像{'id'：id}之類的東西？ –

更新：在ajax請求中，我給出了數據中特定的方法URL和id值（我也從AjaxForm恢復爲HtmlForm），並且它都可以正常工作。感謝上帝！ ....感謝Darin。 –

你能用工作代碼更新這個問題嗎？正是我無法實現的:) – M05Pr1mty

在ASP.Net中動態渲染局部視圖MVC3使用Ajax調用動作的Razor

回答

相關問題