셀렉트박스 readonly 기능 구현하기 (disabled 말구)

셀렉트 박스에서 이미 선택된 값을 출력하고 변경을 못하게 하고 싶을때 쓰면 유용합니다.

 

* disabled를 사용하게 되면 폼데이터를 컨트롤러로 보낼 수 없게됩니다.

* 당연히 아래 코드를 사용하면 데이터를 보낼 수 있습니다 ^^

 

샘플예제 입니다.

 

<select name="fruit" id="fruit" readonly 
        style="background-color:#ababab" 
        onFocus="this.initialSelect = this.selectedIndex;" 
        onChange="this.selectedIndex = this.initialSelect;">
 
<option value=''>ALL</option>
 
<option value='apple' selected>apple</option>
 
<option value='banana'>banana</option>
 
</select>

 

 

selected 옵션의 apple이 기본으로 출력되고 다른 선택옵션을 클릭해도 변경되지 않습니다.