Html.BeginCollectionItem을 사용하여 동적으로 추가된 필드를 모델에 올바르게 바인딩하는 방법은 무엇입니까?

Html.BeginCollectionItem Helper를 사용하여 부분 뷰 전달 ​​컬렉션

문제

Html.BeginCollectionItem Helper를 활용하는 프로젝트에서 JavaScript에 의해 생성된 새 필드는 다음과 같습니다. 양식 제출 중에는 모델에 바인딩되지 않습니다. 또한 BeginCollectionItem 도우미는 새 필드에 대한 숨겨진 태그를 렌더링하지 않았습니다.

해결책

1. 보기 모델 생성:

적절한 데이터 주석을 사용하여 편집할 데이터를 나타내는 보기 모델(예: CashRecipientVM)을 정의합니다.

2. 부분 보기 만들기:

BeginCollectionItem 도우미를 사용하여 필요한 레이블, 텍스트 상자 및 삭제 버튼을 포함하는 부분 보기(_Recipient.cshtml)를 만듭니다.

3 . 부분 보기를 반환하는 메서드 구현:

부분 보기를 반환하는 메서드를 컨트롤러에 구현합니다(예: Recipient()).

4. GET 메서드 업데이트:

메인 뷰의 GET 메서드에서 뷰 모델의 초기 목록을 만듭니다.

5. 기본 보기 업데이트:

기본 보기에서 foreach 루프를 사용하여 기존 개체를 표시하고 BeginCollectionItem 도우미를 사용하여 부분 보기를 추가합니다.

6. 항목 추가를 위한 JavaScript 구현:

버튼 클릭 시 새 보기 모델에 대한 HTML을 양식에 추가하려면 JavaScript를 작성하세요.

7. 항목 삭제를 위한 JavaScript 구현:

삭제 버튼을 클릭하면 항목을 삭제하는 JavaScript를 작성하고 서버에 적절한 AJAX 요청을 보냅니다.

8. POST 메서드 업데이트:

뷰 모델 컬렉션(예: Create(IEnumerable 수신자))을 수신하는 메서드에 다시 게시하도록 양식을 업데이트합니다.

추가 참고 사항:

• 항목을 추가하는 스크립트는 수신자 메서드에 대한 올바른 URL을 사용합니다.
• 데이터 주석을 사용하여 클라이언트 측에서 데이터의 유효성을 검사합니다.
• 성능을 향상하려면 knockout.js 또는 MVVM 프레임워크 사용을 고려하세요. 데이터 바인딩을 위해 JavaScript 대신

위 내용은 Html.BeginCollectionItem을 사용하여 동적으로 추가된 필드를 모델에 올바르게 바인딩하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!