개발하는 도중에 사용자의 입력을 막으려고 disabled를 사용했던 적이 있었다.
그런데 잘 동작하던 기능이 disabled를 넣었더니 동작하지 않았다.
콘솔 창을 봐보니 컨트롤러로 값이 넘어오지 않는 문제가 있었다.
그때는 disabled를 사용하면 입력을 할 수 없다는 것만 알고 있어서 문제점을 찾지 못했다.
알고 보니 입력만 막고 값은 넘기는 readonly 기능이 있었다.
또, 개발 중에 다른 사람이 disabled를 사용하여 문제가 되는 부분을 발견했다.
해당 변수에 값을 받아오지 못해 기능을 나누어 복잡하게 구현해 놓았다.
그러다 보니 중복체크 해야 할 값들이 많았고, 제대로 체크가 되지 않아서 오류도 많이 났다.

'disabled 값이 안 넘어와요', '컨트롤러로 값 전달' 등 여러 가지 검색해봤는데 다른 에러들에 대한 설명이었다.
저 같은 사람들이 이 글을 확인하고 오류를 해결했으면 좋겠습니다.

 

 

위의 코드를 실행해보면 아래와 같은 화면이 나타난다.

 

 

 

기본은 그냥 텍스트박스여서 수정이 가능하다.

 

disabled인 경우는 사용자가 입력을 할 수 없고, 값이 아예 전달되지 않는다.
컨트롤러로 값을 전달해서 사용할 수 없다.

 

readonly인 경우는 사용자가 입력을 할 수 없고, 값이 전달된다.
disabled는 아예 값을 사용하지 못하게 하는데, readonly는 값을 읽어올 수 있다.

 

마지막으로 readonly에 style을 씌웠다.
readonly는 입력을 막는 느낌이 없어서 disabled처럼 수정할 수 없어 보이게 스타일을 주었다.
눈속임이지만 고정된 값이라는 느낌이 오는 것 같다.

 


아직 해보진 않았지만, selectbox인 경우에는 readonly 기능이 없어서 컨트롤러에 값을 보내기 전에 disabled를 해제하고, 사용 후에 다시 disabled를 적용해주면 된다고 한다.

대방이는 hidden으로 하나 만들어서 selectbox 값을 복사한다고 한다.
다음에 필요한 경우에 사용해봐야겠다.