如何在 ASP.NET MVC 中按一下按鈕時動態渲染部分視圖？

在ASP.NET MVC 中點選按鈕動態渲染部分視圖

問題描述：

在ASP.NET MVC 中，您希望在按一下按鈕時在客戶端的特定div內呈現部分視圖，並且部分視圖應該使用在按鈕事件期間動態取得的資料。

程式碼範例：

考慮以下按鈕程式碼：

<button type="button">

此按鈕嘗試導覽點擊時指向單獨的 URL。為了改為處理點擊事件並動態渲染部分視圖，我們需要修改程式碼如下：

<button>

此外，將以下腳本新增至頁面：

var url = '@Url.Action("DisplaySearchResults", "Search")';
$('#search').click(function() {
  var keyWord = $('#Keyword').val(); // Retrieve the user-entered search text
  $('#searchResults').load(url, { searchText: keyWord });
});

修改控制器方法以接受搜尋文字作為參數：

public ActionResult DisplaySearchResults(string searchText)
{
  // Build list based on the provided searchText and return the partial view
  var model = // To be implemented
  return PartialView("SearchResults", model);
}

解釋：

• jQuery .load 方法對指定的 URL 進行 AJAX 調用，傳遞 data 參數中提供的任何資料.
• 控制器方法負責根據動態提供的部分視圖產生data。
• 更新的內容載入到#searchResults div中，動態渲染部分視圖。

注意：如果您的模型類別包含多個屬性驗證屬性，用以下程式碼取代onclick 處理並使用提交按鈕：

$('form').submit(function() {
  if (!$(this).valid()) { return false; }
  var url = '@Url.Action("DisplaySearchResults", "Search")';
  var form = $(this).serialize();
  $('#searchResults').load(url, form);
  return false;

在在這種情況下，控制器方法應該處理完整的SearchCriterionModel 物件：

public ActionResult DisplaySearchResults(SearchCriterionModel criteria)
{
  var model = // Build list based on the properties of criteria and return the partial view
  return PartialView("SearchResults", model);
}

以上是如何在 ASP.NET MVC 中按一下按鈕時動態渲染部分視圖？的詳細內容。更多資訊請關注PHP中文網其他相關文章！