Spring - Ajax contentType과 form list 보내기에 필요한 / .stringify()/.serialize() /.serializeObject

Coding/JAVA 2020. 2. 7. 09:19

Ajax에 FormData를 보내는 방법은 여러가지있다.

프런트에서 form을 Object해서  Spring에서 get방식이면 @RequestParam으로 Object받거나

해당 키값으로 String [Key Name] 으로 매개변수를 받을수있다

Post 방슥인 @RequestBody로 해서 같은 방식으로 받는다...

 

다만 Ajax ContextType이 기본 방식은

 Content-Type: application/x-www-form-urlencoded; charset=UTF-8

으로 Ajax를 이용할때 JSON을 이용하는데 문제가 생긴다.

 Content-Type: application/application/json; charset=UTF-8 

으로 변경 해주고 JSON을 이용하거나 Object을 이용할때는 딱히 지정할필요없다. 그럼 기본형식으로간다.

 

JSON으로 보낼때 이용해야되는방법은 - 

데이터들을 

var dataArr= new Array();
d

선언 해주고 

 

var dataObj= new Object();

하나 더 선언 후  dataObj 에 Object을 넣어준다.

dataObj.decode_flag=$("#decode_flag_"+i).val();

이런식으로 dataObj.[오브젝트Name] = 벨류 형식으로 넣어준다.

 

그후 Ajax으로 보낼때

data: formdata

이런식으로 json파일은 400이나 415나 타입오류 .. 오류를 뿝는다.

data: JSON.stringify(formdata)

이렇게 String 화 시켜서 보낸다...

.serialize() 를해서 보내는건 log를 찍어보면 key=value&key2=value&key3=value& get방식의 보낸다.

이렇게 받을라면 object나 String key 형식으로 받는다 .

 

위 dataArr 선언이나 object를 만들어서 보내지 않고 폼데이터를 한번에 Json화 시키는방법은

.serializeObject() 을 만들어서 보내는 방법이다 

이 방법은 .serializeArray() 를 이용한 펑션 만드는건데 Jquery 에서 공식적으로 지원하는 플러그인이도 있다.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
jQuery.fn.serializeObject = function() { 
    var obj = null;
    try { 
        if(this[0].tagName && this[0].tagName.toUpperCase() == "FORM" ) { 
            var arr = this.serializeArray(); 
            if(arr) {
                obj = {};
                jQuery.each(arr, function() { 
                    obj[this.name= this.value; 
                }); 
            } 
        } 
    }catch(e) { 
        alert(e.message); 
    }finally {
 
    } 
    return obj; 
}
 

이 펑션을 하나 js파일로 만들어서 include해주거나 선언하고 사용하도록한다...

그럼 위에 방식 dataObjcet를 list만들엇던 형태로 Form을 JSON으로 만들어준다.

 

 

 

 

 

 

 

설정

트랙백

댓글