JSP option의 선택한 value값으로 다른 option 값 바뀌게 하기2(도서등록 form)

                  <div class="row">
                    <div class="col-sm-6">
                      <!-- Select multiple-->
                      <div class="form-group">
                        <label>관련분류</label>
                        <select id="relCategory" name="rel" multiple class="form-control">
                          <option value="학습법일반">학습법일반</option>
                          <option value="자녀교육일반">자녀교육일반</option>
                          <option value="소설">소설</option>
                          <option value="에세이">에세이</option>
                          <option value="SF">SF</option>
                        </select>
                      </div>
                    </div>
                    <div class="col-sm-6">
                      <div class="form-group">
                        <label>관련분류 확인</label>
                        <select id="relCategoryConfirm" name="relCategoryConfirm" multiple class="form-control" disabled>
                          <option value="학습법일반">학습법일반</option>
                          <option value="자녀교육일반">자녀교육일반</option>
                          <option value="소설">소설</option>
                          <option value="에세이">에세이</option>
                          <option value="SF">SF</option>
                        </select>
                      </div>
                    </div>
                  </div>

 

 

 

$(function(){

   $('#relCategory').on('change',function(){
	//선택된 관련분류를 배열로 만들고 이름 ,(쉼표)로 구분하여 합침
	let text = $('#relCategory option:selected').toArray().map(item=>item.text).join(",");
	//선택된 관련분류 값을 확인
	console.log("text:"+text);
	
	//선택된 관련분류 확인의 선택을 초기화함
	$('#relCategoryConfirm option:selected').prop('selected',false);
    		selected라는 속성을 false로 만들어주자 -->초기화하자
	//선택된 관련분류 값(값1,값2,값3)을 ,(쉼표)로 나누어 반복처리
	$.each(text.split(","),function(i,e){
		//값1,값2,값3에 해당하면 선택된것으로 처리
		$("#relCategoryConfirm option[value='"+e+"']").prop("selected",true);
        오른쪽창의 option[value=""]의 값을 넣어주고, seleted속성을 true로 만들자 
		});
	}); 
});

1.누름 
2.누른값을 배열->텍스트로 만들어 합쳐줌 
2.초기화 .prop('selected',false)
3.선택 for을 이용해 선택된값들을 붙여주고, prop('seleted',true)로 바꿔줌

.toArray() --> 가져온값을 배열로 만들어줌
.map(item=>item.text) --> 가져온값들을 item 이라는 변수이름을 붙여주고 text로 만들어줌
.join() --> 가져온 값들을 ,(쉼표)로 구분하여 합침 
만약 join()을 해주지않으면 객체가 됨

  	$('#relCategory').on('change',function(){
	select = $(this).val();
	$('#relCategoryConfirm').val(select); 
});

이것도 사용 가능 

 

 

출력 성공