하단에서 유효성 검사가 실패하면 브라우저가 페이지 상단에 표시되는 이유는 무엇입니까?

Question

ValidationGroup을 설정하여 ValidationSummary가있는 RequiredFieldValidatior를 구현했습니다.

관련 버튼을 클릭하면 정상적으로 작동합니다!

하지만 뷰포트가 페이지 상단에서 바뀌고 이동하고 내 유효 기간 결과 및 버튼 등이 페이지 하단의 양호하지 않습니다.

이 문제를 방지하고 버튼을 누른 후에도 브라우저가 동일한 영역을 계속 가게 할 수있는 방법이 있습니까?

추가 참고 : 유효성 검사가 클라이언트 쪽에서 실패합니다. 따라서 포스트 백이 발생하지 않습니다. 기본적으로 유효성 검사가 실패하고 뷰포트가 페이지 상단으로 미끄러집니다.

Answer 1

당신의 RequiredFieldValidator 다음 텍스트 상자/입력 타입으로 커서를 이동합니다 SetFocusOnError의 옵션이 있습니다.

그런 다음 페이지 상단에 페이지 선언에 수동으로 유효성 검사를 호출 할 때 확인하지 않은 주먹 요소에 포커스를 설정하기 전에이 작업을 수행 한 MaintainScrollPositionOnPostback="true"

<%@ Page MaintainScrollPositionOnPostback="true" %>

Answer 2

당신은 당신의 페이지 상단에 다음 지시문을 추가하여이를 달성 할 수 있습니다에서

<%@ Page MaintainScrollPositionOnPostback="true" %> 

Answer 3

에 추가 :

//has to be called after Page_ClientValidate() 
function ValidatorFocus() 
{ 
    var i; 
    for (i = 0; i < Page_Validators.length; i++) 
    { 
     if (!Page_Validators[i].isvalid) 
     { 
      document.getElementById(Page_Validators[i].controltovalidate).focus(); 
      break; 
     } 
    } 
}