개발자/개발(회사용)

[js] ajax formdata serialize

엘리씨 2021. 2. 23. 01:26

[html]

<form name="ajaxForm" id="ajaxForm">

            <div>

                <label for="title">제목</label>

                <input type="text" name="title" id="title">

            </div>

            <div>

                <label for="chkArray">chkArray</label>

                <input type="text" name="chkArray" id="chkArray" value=''>

            </div>

            <div>

                <label for="title">내용</label>

                <input type="text" name="content" id="content">

            </div>

            <input type="button" value="ajax 폼전송" onclick="ajaxFormSubmit()" /> 

        </form>

       

 

[js]

function ajaxFormSubmit(){

            //console.log(11);

            var chkArray = new Array();

            $('input:checkbox[name=checkOne]:checked').each(function(){

                chkArray.push(this.value);

            })

            console.log(chkArray);

            $('#chkArray').val(chkArray);

 

            var formData = $("#ajaxForm").serialize();

            console.log(formData);

 

            $.ajax({

                        headers: {

                            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')

                        },

                        type: 'POST',

                        url: "{{Route('pushSend')}}",

                        data: formData,

                        dataType: 'text',

                        success: function(data) {

                            console.log(data);

                            alert('성공'+data),

                            location.href="{{Route('memberList')}}";

                        },

                        error: function(request,status,error){

                                    alert("code:"+request.status+"\n"+

                                    "message:"+request.responseText+"\n"+"error:"+error);}

                    });

 

        }

 

 

//dataType 'text'가 아니라 json으로 바꾸면

토큰값 (배열) 때문에 에러남 -> name="chkArray[]" 이런식으로바꾸면됨.

 

 

[controller - 값확인]

public function pushSend(Request $request){

        $test=$request->input('title');

        $test2=$request->input('chkArray');

        $test3=$request->input('content');

 

        return $request->input(); //으로 해서 ajax success 부분에서 확인가능 

        echo $test2;

    }