• 목차

개요

• name 속성은 폼(form)이 제출된 후 서버에서 폼 데이터(form data)를 참조하기 위해 사용되거나, 자바스크립트에서 요소를 참조하기 위해 사용됩니다.
• 중복된 name 값을 받아보자.

controller 에서 받기

<form>
		<input type='checkbox' name='price' value='111'/>
		<input type='checkbox' name='price' value='222'/>
		<input type='checkbox' name='price' value='333'/>
		<input type='checkbox' name='price' value='444'/>
</form>

public class PriceVO {
		private String price; // 111,222,333,444
}

• 여러 개의 동일한 name을 가진 폼이 존재할 경우 controller에 넘어갈 때 각각의 값이 ','를 구분자로 하여 하나의 문장으로 연결되어 넘어갑니다.
• 예) 각각의 price 값이 111, 222, 333, 444 라면, 폼에 바인딩되는 VO의 멤버 변수 price에는 "111, 222, 333, 444" 로 저장됨.
• 따라서 VO가 해당 name을 가진 멤버 변수를 가지고 있다면, controller에서 해당 name의 멤버 변수의 값을 ','를 구분자로 하여 잘라내서 원하시는 형태로 사용하실 수가 있습니다.

JavaScript 에서 받기

<div>
		<input type='text' name='price' value='111'/>
		<input type='text' name='price' value='222'/>
		<input type='text' name='price' value='333'/>
		<input type='text' name='price' value='444'/>
		<input type="button" id="arrayButton" value="click"/>
</div>

$("#arrayButton").on("click", function() {
		// 값들의 갯수 -> 배열 길이를 지정
		var length = $("input[name=price]").length;
		// 배열 생성
		var arr = new Array(length);
		// 배열 값 입력
		for(var i = 0; i < length; i++) {
			arr[i] = $("input[name=price]").eq(i).val();
			console.log(arr[i]);
		}
})