버튼 클릭 시 ASP.NET MVC에서 부분 뷰를 동적으로 렌더링하는 방법은 무엇입니까?

ASP.NET MVC에서 버튼 클릭 시 부분 뷰를 동적으로 렌더링

문제 설명:

ASP.NET MVC에서 , 버튼을 클릭하면 클라이언트 측의 특정 div 내부에 부분 보기를 렌더링하려고 하며 부분 보기는 다음을 사용해야 합니다. 버튼 이벤트 중에 동적으로 얻은 데이터.

코드 예:

다음 버튼 코드를 고려하세요.

<button type="button"></button>

이 버튼은 클릭하면 별도의 URL이 생성됩니다. 대신 클릭 이벤트를 처리하고 부분 보기를 동적으로 렌더링하려면 다음과 같이 코드를 수정해야 합니다.

<button></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 중국어 웹사이트의 기타 관련 기사를 참조하세요!