본문 바로가기
HTML

[HTML]하나의 form태그에서 여러 개의 submit 보내기

by wone_yam 2024. 11. 26.

하나의 form태그에서 여러 개의 submit 보내기

문제 발생

하나의 폼 태그 안에서 서로 다른 주소로 요청을 보내고 싶었다(여러 개의 버튼)

 

그래서 생각한 방법이

<form id='search' action='Search.jsp'></form>

<form action='Insert.jsp'>
        <input name='id' value='아이디'>아이디</input>
        <input type="password" name='pw' value='비밀번호'>비밀번호</input>
        <input name='name' value='성명'></input>
        <input name='email' value='이메일'></input>
        <input name='contact' value='전화번호'></input>

        <button type='submit' >등록</button>
        <button type='submit' form='search'>조회</button>
</form>

미리 form 태그를 하나 만들어두고 id를 search로 주니 정상적으로 이동..!

 

하지만 내가 필요한 파라미터들은 전부 다 이동하지 않았다...

문제 해결

 

방법 1

<form action='Insert.jsp'>
        <input name='id' value='아이디'>아이디</input>
        <input type="password" name='pw' value='비밀번호'>비밀번호</input>
        <input name='name' value='성명'></input>
        <input name='email' value='이메일'></input>
        <input name='contact' value='전화번호'></input>

        <button type='submit' name='flag' value='insert'>등록</button>
        <button type='submit' name='flag' value='search'>조회</button>
</form>

 

submit을 보내면 [name, value] 가 key, value 형태로 넘어간다는 사실을 알았다 그래서 서버 측에서 name에 따라 분기를 나누어 처리하는 방법

 

방법 2

<form action='Insert.jsp'>
        <input name='id' value='아이디'>아이디</input>
        <input type="password" name='pw' value='비밀번호'>비밀번호</input>
        <input name='name' value='성명'></input>
        <input name='email' value='이메일'></input>
        <input name='contact' value='전화번호'></input>

        <button type='submit'>등록</button>
        <button type='submit' formaction='Search.jsp'>조회</button>
</form>

 

formaction 속성을 이용하면 input으로 받은 파라미터들이 다 같이 넘어가게 된다.

 

해당 버전 밑의 브라우저는 formaction은 지원하지 않으니 주의!!