> 웹 프론트엔드 > JS 튜토리얼 > 한 번의 버튼 클릭으로 더 많은 양식 제출

한 번의 버튼 클릭으로 더 많은 양식 제출

PHPz
풀어 주다: 2024-07-31 14:39:52
원래의
555명이 탐색했습니다.

Submit r More forms in one button click

웹 페이지의 두 개가 서로 다른 위치에 있다고 가정해 보겠습니다. 하지만 한 번의 클릭으로 두 개의 양식을 제출하고 싶습니다. 그런 다음 -

을 사용하세요.

HTML:

<form id="form1">
   <!-- Form 1 fields -->
   <input type="text" name="field1" placeholder="Field 1">
</form>

<form id="form2">
    <!-- Form 2 fields -->
    <input type="text" name="field2" placeholder="Field 2">
</form>
로그인 후 복사

JS:

window.addEventListener('load', function() {
            // Get form data
            let form1 = new FormData(document.getElementById('form1'));
            let form2 = new FormData(document.getElementById('form2'));

            // Combine both forms data into URLSearchParams
            let urlParams = new URLSearchParams();
            form1.forEach((value, key) => {
                urlParams.append(key, value);
            });
            form2.forEach((value, key) => {
                urlParams.append(key, value);
            });

            // Redirect to a new URL with combined form data
            window.location.href = '/submit-both-forms?' + urlParams.toString();
        });
로그인 후 복사

이렇게 하면 해당 위치로 get 요청이 전송됩니다.

위 내용은 한 번의 버튼 클릭으로 더 많은 양식 제출의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:dev.to
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿