"다음 버튼이 안 눌려요"의 진짜 원인은 대개 이것입니다

여러 단계로 나눈 폼에서 "저장하고 다음을 눌러도 안 넘어간다"는 제보를 받았습니다.

확인해 보니 버튼은 정상이었고, 입력값 검사에 걸려서 되돌아온 것이었습니다. 문제는 빨간 안내 글자가 잘못된 칸 바로 옆에만 있었다는 점입니다. 버튼을 누르면 화면이 맨 위로 올라가는데, 그 위치에서는 아무 변화가 안 보입니다. 쓰는 사람 눈에는 "눌러도 아무 일이 없다"입니다.

해결은 간단합니다. 폼 맨 위에 "넘어가지 못한 이유"를 요약해서 띄우는 것.

여러 단계 폼을 만들 때는 상단 요약을 기본으로 넣으세요. 칸 옆 안내만으로는 부족합니다. 그리고 이런 건 코드로만 테스트하면 절대 안 잡힙니다. 실제로 브라우저에서 버튼을 눌러 봐야 보입니다.