• 같은 name을 가진 input 값을 update처리하는 기능

view

<form>
<input type="text" name="test" value="첫번째 값">
<input type="text" name="test" value="두번째 값">
<input type="text" name="test" value="세번째 값">
</form>

제이쿼리

var data = $("form").serializeArray();
var arr = new Array();
var map = new Map();

for(var i=0;i<data.length;i++){
	map.set(data[i].name, data[i].value);
};

arr.push(map);

var data = $("form").serializeArray()

• form 내 데이터를 JSON형태로 바꿔서 배열로 리턴
• name, value값이 각각 key:value 형태로 바뀜

data = [{name:"test" ,value:"첫번째 값"},{name:"test" ,value:"두번째 값"},{name:"test" ,value:"세번째 값"}]

serialize()
form 내 모든 값을 문자열 하나로 합침
test=첫번째 값&test=두번째 값&test=세번째 값

for

• 배열 data의 key값(name, value)에 대응하는 map을 만듬

// for문 내부
map.set("test", "첫번째값");
map.set("test", "두번째값");
map.set("test", "세번째값");

arr.push(map)

• 만들어진 map을 arr에 push

arr = [{"test":"첫번째 값"},{"test":"두번째 값"},{"test":"세번째 값"}]

ajax

$.ajax({
	url: 처리할 url,
	data: JSON.stringify(arr),
	contentType: 'application/json',
	type: "POST",
	success: function(){
		alert("수정이 완료되었습니다.");				
	},
	error: function(){
		alert("다시 시도해주세요.");
	}
});

data: JSON.stringify(arr)

• 생성한 array를 JSON으로 변환

참고: https://ko.javascript.info/json

contentType: 'application/json'

• 보내는 데이터 타입이 JSON임을 명시

Controller

@RequestMapping("ajax를 처리할 url")
@ResponseBody
public void sample(@RequestBody List<Map<String, Object>> list){
	...
}

• List<Map<String, Object>>타입의 변수로 arr을 받음
  • arr = [{"test":"첫번째 값"},{"test":"두번째 값"},{"test":"세번째 값"}]
  • 자바스크립트 배열도 List로 받을 수 있음

쿼리문 처리(Mybatis-Oracle)

<update id="updateSample" parameterType="java.util.List" flushCache="true">
	<foreach collection="list" item="item" index="index" separator=";" open="DECLARE BEGIN" close="; END;" >
	UPDATE 테이블명
       SET
		컬럼 = #{item.test}
    WHERE 조건식
	</foreach>
</update>

• foreach구문으로 프로시저를 선언하여 다중쿼리 처리
• 조건식에 해당하는 컬럼이 변경됨
  • 해당 예문에서는 조건식을 다르게 설정하지 않았으므로 같은 컬럼이 3번(첫번째 값, 두번째 값, 세번째 값) 업데이트 될 것