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

JSP

  <div class="row">
                    <div class="col-sm-6">
                      <!-- select 테이블명/컬럼명은 최대 300Bytes
                      	결제혜택 : 용어(단어+단어) => PAY_BEFT
                      	결제 : 단어 => pay
                      	혜택 : 단어 => benefit => beft
                      	-->
                      <div class="form-group">
                        <label>결제혜택</label>
                        <select id="payBeft" name="payBeft" class="form-control">
                          <option value="">카드/간편결제 혜택을 확인하세요</option>
                          <option value="card">쵸니카드25,000캐시백</option>
                          <option value="point">쵸니포인트100점</option>
                          <option value="pay">쵸니페이1000원 즉시할인</option>
                        </select>
                      </div>
                    </div>
                    <!-- 결제혜택을 선택하면 자동으로 선택된 내역이 sync(연결)됨 -->
                    <div class="col-sm-6">
                      <div class="form-group">
                        <label>결제혜택 확인</label>
                        <select id="payBeftConfirm" name="payBeftConfirm"class="form-control" disabled>
                          <option value="">카드/간편결제 혜택을 확인하세요</option>
                          <option value="card">쵸니카드25,000캐시백</option>
                          <option value="point">쵸니포인트100점</option>
                          <option value="pay">쵸니페이1000원 즉시할인</option>
                        </select>
                      </div>
                    </div>
                  </div>

 

 

자바스크립트

$(function(){
	//방법1 
    	$('#payBeft').on('change',function(){
		select = $(this).val();
		$('#payBeftConfirm').val(select);
	});  
	
	//방법2
 	$('#payBeft').on('change',function(){
		console.log($(":selected").val());
		$('#payBeftConfirm').val($(":selected").val());
	});
 });

 

선택한(this, :selected) 값을

붙여넣을 곳의 value에 넣으면 성공! 

 

click -> 클릭했을때만 이벤트 실행

change -> 클릭, 키보드 선택 등 바뀌었을때 이벤트 실행 

출력 성공!