ajax로 페이지이동없이 form데이터 전송하는걸 만들었는데 뭔가 이상해요

ajax로 페이지이동없이 form데이터 전송하는걸 만들었는데 뭔가 이상해요

QA

ajax로 페이지이동없이 form데이터 전송하는걸 만들었는데 뭔가 이상해요

본문

<script>
    function formSubmit() {
        var params = jQuery('#form').serialize();
        jQuery.ajax({
            url: 'sample.php',
            type: 'POST',
            data: params,
            contentType: 'application/x-www-form-urlencoded; charset=UTF-8',
            dataType: 'html',
            success: function (res) {
                alert("완료");
            }
        });
    }
</script>

 

이렇게 만들어서 페이지이동없이 데이터가 전송이 되는것까지는 확인을 했는데 alert 창을 누른 후 화면이 젤 위로 이동이 됩니다

전 form 입력하는 그 위치 그대로 있기를 원하는데 이게 불가능한 기능인가요?

이 질문에 댓글 쓰기 :

답변 1

<a href="#" onclick="formSubmit();">확인</a>

과 같이 처리했다면, forumSubmit() 실행 이후, href="#" 이 수행되어 페이지의 맨 윗쪽으로 이동하게 됩니다.

 

<a href="#" onclick="formSubmit(); return false;">확인</a>

return false; 를 추가하여 href 수행을 취소할 수 있습니다.

 

<button type="button" class="btn_03" ~

로 type="button" 을 넣어주지 않으면.. 기본 type="submit" 으로 인식되어 onclick 없이도 from 전송 액션이 일어납니다.

onclick 이벤트만을 실행하고자 한다면 type="button"을 명시적으로 추가해주면 됩니다.

답변을 작성하시기 전에 로그인 해주세요.
전체 1

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT