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

ASP.NET MVC에서 버튼 클릭 시 부분 뷰 렌더링

ASP.NET MVC의 일반적인 시나리오는 부분 뷰를 동적으로 로드해야 한다는 것입니다. 일반적으로 버튼 클릭과 같은 사용자 작업에 대한 응답으로 페이지의 특정 섹션을 봅니다. 이 기술을 사용하면 전체 페이지를 새로 고칠 필요 없이 모듈식이며 유연한 콘텐츠 표시가 가능합니다.

문제 설명

ASP.NET MVC 애플리케이션이 있다고 가정합니다. 페이지의 별도 섹션에 검색 결과를 표시해야 하는 검색 양식입니다. 검색 버튼을 클릭하면 검색 결과를 검색하고 부분 보기를 사용하여 렌더링하고 싶지만 전체 페이지 콘텐츠를 대체하지는 않습니다.

해결책

이를 달성하려면 다음 단계를 구현할 수 있습니다.

1. 부분 보기 만들기: 검색 결과를 표시할 모델로 부분 보기를 정의합니다.
2. 검색 버튼 수정: 검색 양식의 버튼을 일반 HTML 버튼으로 바꾸고 ID를 할당합니다.
3. JavaScript 구현: 검색 버튼의 클릭 이벤트에 JavaScript 이벤트 핸들러를 추가합니다. 이 핸들러에서 jQuery load() 함수를 사용하여 AJAX 호출을 실행합니다.
4. 컨트롤러 메서드 구성: 검색 버튼 클릭을 처리하는 컨트롤러 메서드는 검색 매개변수를 수락하고 부분을 반환해야 합니다. 결과를 모델로 봅니다.

예 구현

HTML:

<button></button>

JavaScript:

var url = '@Url.Action("DisplaySearchResults", "Search")';
$('#search').click(function() {
  var searchText = $('#searchInput').val();
  $('#searchResults').load(url, {searchText: searchText});
});

컨트롤러 방법:

public ActionResult DisplaySearchResults(string searchText)
{
  var model = // Build the model based on the searchText parameter

  return PartialView("SearchResults", model);
}

이 접근 방식을 사용하면 전체 페이지를 다시 로드하지 않고도 지정된 div 내에서 부분 보기를 동적으로 렌더링할 수 있어 검색 결과를 표시하는 사용자 친화적이고 효율적인 방법을 제공합니다.

위 내용은 버튼 클릭 시 ASP.NET MVC에서 부분 뷰를 렌더링하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!