[HTML] Form태그와 Ajax

happypath·2021년 11월 18일
0

Web

목록 보기
2/6

오늘 오전 내내 삽질했던,,, html에서 form태그로 정보를 ajax로 받아서 flask 서버로 넘기는데 nonetype이 자꾸 뜨는 것이었다.

우선 form을 제거하고 임시로 구현해놨었는데, 드디어 해결!ㅜㅜㅜ 감격의 순간이다. 너무 간단한건데 삽질했다는 것에 대한 안타까움...


이전 코드

    <form method="POST">
        <p>아이디: </p>
        <input type="text" id="userId" name="userId">
        <p>비밀번호: </p>
        <input type="text" id="userPw" name="userPw">
        <p id="login_msg"></p>
        <button onClick="login()">로그인</button>
    </form>

수정 코드

    <form method="POST">
        <p>아이디: </p>
        <input type="text" id="userId" name="userId">
        <p>비밀번호: </p>
        <input type="text" id="userPw" name="userPw">
        <p id="login_msg"></p>
        <button type="button" onClick="login()">로그인</button>
    </form>

원인은 바로 button 태그에 있었다.

button 태그는 기본으로 type이 submit으로 지정이 되어있다고 한다.
그래서 button onClick함수가 실행되고 데이터를 보내기도 전에, button이 submit을 실행하면서 서버에서는 none값을 계속 받았던 것!

form 태그 안에 있는 버튼에는 type='button'을 지정해주고, onClick함수가 ajax로 연결되며 문제없이 잘 돌아간다!!!!!

0개의 댓글