input, textarea Name 설정

So Vidi·2023년 11월 9일

JavaScript

목록 보기
10/31

input name

input 에 name 을 설정할 경우 두가지의 옵션이 생기는데,

첫째는 코드단에서 input 의 이름을 추적 경로로 바로 사용 가능하다는 점,

예시)

<input name="testInput" onClick={(e)=>{test(e)}}/>

const test = (e) => {
	e.target.testInput.value = "hehe"
}

둘째 Object.fromEntries() 처리 했다면 name 값으로 {…} 들어가 있는 값을 추적도 가능하다.

<form onSubmit={(e)=>{save(e)}}>
	<input name="id"/>
	<input name="name"/>
	<textarea name="text"></textare>
</form>

const save = (e) => {
	let formData = new Formdata(value)
	let objData = Object.fromEntries(formData)
}

... result
{id: 1, name: 2, text: 3}

위의 명령문을 form 태그에 걸게 되면 안에 있는 input 과 textarea 의 value 값들이 각각 설정된 name 이 key 값으로써 들어간 오브젝트가 된다.

셋째는 둘째의 연장선인데 결과적으로 name = key값으로써 서버에 들어갈 데이터의 column 값이 되고 value 가 데이터로 들어가게 된다는 점.

profile
먹을거 좋아하는데 마른 개발자

0개의 댓글