JavaScript를 사용한 동적 양식 제출 - 우아한 코드를 사용하는 방법은 무엇입니까?

Question

여기에 문제가 있습니다.

내 페이지에 항목 세트가 표시됩니다. 각 항목에는 양식의 일부인 확인란이 있습니다. 사용자는 이러한 확인란을 확인하고 '삭제'버튼을 누를 수 있습니다. 같은 페이지에는 '업로드'버튼이있어 Excel 항목을 업로드합니다. 현재, 내 양식 액션은 "xyzaction"이라고 말하기 위해 Sumbits와 두 개의 다른 핸들러 (Struts Action과 유사)가 있습니다.

이 작업을 수행하는 가장 좋은 방법은 다음 중 하나를 수행하여 JavaScript에 의존하는 것입니다. 1)) 업로드 및 삭제 버튼을 누르는 경우 양식 조치 - 다른 작업을 호출하여 버튼을 삭제합니다. 2) 숨겨진 변수 "act"를 사용하여 삭제 / 업로드하고 단일 양식으로 제출하도록 설정하십시오. 서버 측 작업은 행위를 식별하고 해당 조치로 전달하는 것을 관리합니다.

접근 (1) - 나에게는 매우 우연히 보입니다. 양식 액션으로 노는 것은 불필요한 것 같습니다. 접근 (2) - JavaScript가 꺼져 있고 매우 우아하지 않은 경우 분명히 작동하지 않습니다.

이 작업을 수행하는 세 번째 방법이 있어야합니까?

Answer 1

먼저 HTML을 맞아야합니다.

두 가지 다른 조치가 있으므로 두 가지 양식이 있어야합니다. 좋은 규칙은 각 양식에 하나의 제출 버튼 만 있어야한다는 것입니다. 이것은 HTML의 모범 사례이며 페이지가 JS 나 다른 속임수없이 작동하도록합니다.

이와 같이 페이지가 작동하면 JS를 사용하여 DOM을 조작하여 필요한 UI를 생성하십시오. 이것은 JS를 사용하여 UI에 Behvour를 추가하고 눈에 띄지 않는 JS를위한 모범 사례입니다.

(실제로 동작을 단일 양식으로 혼동하려면 JS로 양식의 동작을 변경하는 것이 가장 좋은 작업입니다. 그러나 사용자가 확인란을 확인한 다음 마음을 변경하고 파일을 업로드하면 어떻게 될지 고려하십시오. 체크 박스를 확인합니다. 이렇게하면 아무것도 삭제하지 않아야합니다.)

Answer 2

두 가지 다른 행동을 위해 두 가지 다른 형태가 필요할 수 있습니다.