수정할 데이터 input에 값 자동세팅방법

|| 문제사항

데이터를 수정할때 저장된 데이터를 불러와 해당 input에 맞게 자동으로 세팅하는 방법.!

하나씩 값을 찾아 $('#아이디').val('값') 이런식으로 대입해도 되겠지만.. 

input개수가 많아진다면.. 일일이 체크하는것도 힘들고, 코드길이도 불필요할정도로 길어질수 있기 때문에,

each문을 이용하여 간결하게 작성하는 방법

 

|| script 처리방법

<script>
//저장되어있던 데이터
var dataInfo = {"id":"a-value" , "alias":"b-value"}; 

//입력form의 input을 체크하여 name값들을 구한다.
$("form#formArea :input").each(function(){
   var input = $(this);
   var inputNm = input[0].name;
    
   //1.저장되어있는 데이터에 name값을 이용하여 value를 꺼낸 후 
   //2.name값에 해당하는 form의 input을 찾아 값을 세팅한다.
   input.val(dataInfo[inputNm]);
});
</script>

jaon = {  name : value }

: json형식에서 값(value)은 이름(name)을 사용하여 구할 수 있다.

참고자료 : https://developer.mozilla.org/ko/docs/Learn/JavaScript/Objects/JSON

 

|| html 

<form id="formArea">
   아이디 : <input type="text" id="id" name="id" value=""/>
   별명 : <input type="text" id="alias" name="alias" value=""/>
</form>

 

|| 결과

var dataInfo = {"id":"a-value" , "alias":"b-value"}; 

 

아이디( id )

별명( alias )