위토즈 - 개발자프로그램판매공간

정보공유

[JQUERY] 폼을 생성하고 선택된(필요한) 영역의 값만 전송


필요한 영역만 ajax 로 전송 하는 방법.



<form method="post" name="wzfrm" id="wzfrm" action="" onsubmit="return getNext();" autocomplete="off">

    <div class="wrap-doc-input">

        <div>

            <input type="hidden" name="extend_fil_mode[]" class="attach-file-mode" value="1">

            <input type="hidden" name="extend_fil_type[]" value="WORD">

        </div>

        <div>

            <input type="hidden" name="extend_fil_mode[]" class="attach-file-mode" value="2">

            <input type="hidden" name="extend_fil_type[]" value="PDF">

        </div>

        <input type="text" name="upload_reason" id="" value="테스트1">

        <input type="button" value="전송" class="btn-submit">

    </div>

    <div class="wrap-doc-input">

        <div>

            <input type="hidden" name="extend_fil_mode[]" class="attach-file-mode" value="3">

            <input type="hidden" name="extend_fil_type[]" value="WORD">

        </div>

        <div>

            <input type="hidden" name="extend_fil_mode[]" class="attach-file-mode" value="4">

            <input type="hidden" name="extend_fil_type[]" value="PDF">

        </div>

        <input type="text" name="upload_reason" id="" value="테스트2">

        <input type="button" value="전송" class="btn-submit">

    </div>

</form>


<script type="text/javascript">

<!--

    jQuery(document).ready(function () {

        $(document).on('click', '.btn-submit', function() {


            let tmpForm = document.createElement('form');

                tmpForm.setAttribute('charset', 'utf-8');

                tmpForm.setAttribute('method', 'post');


            let formData = new FormData($(tmpForm)[0]);

            let $parent = $(this).closest('.wrap-doc-input');


            let $inputs = $parent.find('input:hidden, input:text');

                $inputs.each(

                    function() {

                        formData.append($(this).attr('name'), $(this).val());

                    }

                );



            $.ajax({

                url: g5_bbs_url+'/test_update.php',

                data: formData,

                processData: false,

        contentType: false,

                dataType: 'json',

                type:'post',

                success:function(req) {

                    ;

                }

            });


        });

    });

//-->

</script>


정보공유
Total 52건 1 페이지
번호 제목 글쓴이 날짜 조회
52 금액 카운팅 모션 다라라락 변화 위토즈쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 06-26 1651
51 php 와 ajax 를 이용해서 파일 업로드 할때 대용량 파일을 업로드 하는 방법 위토즈쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 05-23 2508
50 datepicker 를 이용해서 달력3개를 표시하고 원하는 날짜만 선택이 가능하도록. 위토즈쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 04-28 2347
49 magnificPopup css 를 추가하여 popup 마다 다른 사이즈 로 띄우기. 위토즈쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 01-16 2981
48 magnificPopup 조건이 맞지 않으면 popup 띄우지 않기. 위토즈쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 01-12 2994
47 magnificPopup iframe 으로 form submit 하기 위토즈쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 01-12 3022
46 magnificPopup 으로 창을 호출 후 날짜 입력박스에 datepicker 실행되지 않는경우 위토즈쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 04-13 3920
45 magnificPopup 파라미터 변수 값 ajax 타입으로 전송 방법 위토즈쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 03-31 3896
44 jquery 로 text 필드와 file 첨부를 동시에. 위토즈쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 03-09 3827
43 파일 첨부 를 이미지버튼으로 대체한경우 첨부한 파일명 표시하기. 위토즈쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 03-09 3834
열람중 폼을 생성하고 선택된(필요한) 영역의 값만 전송 위토즈쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 01-17 4565
41 탭으로 나눠지는 슬라이드 쇼 위토즈쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 11-13 5747
40 jquery fullcalendar eventOrder 정렬 위토즈쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 08-23 14683
39 주소복사 계좌번호복사 URL복사 위토즈쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 05-11 13087
38 jquery 스와이프 메뉴 위토즈쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 04-15 14189