[HTML] disabled 와 readonly의 차이

jsp로 MVC를 연습하던 중, 회원정보 수정에서 아이디와 이름을 바꾸지 못하게 하고 비밀번호와 이메일만 바꿀 수 있게 하려 했다.

 

 <div class="container">
        <form action="/member/modifyMember.do" method="post">
            <div class="form-group">
                <label for="exampleInputName">이름</label>
                <input type="text" class="form-control" id="exampleInputName" value ="${member.name}" name="name" disabled>
            </div>
            <div class="form-group">
                <label for="exampleInputId">아이디</label>
                <input type="text" class="form-control" id="exampleInputId" value="${member.id}" name ="id"  disabled>
            </div>
            <div class="form-group">
                <label for="exampleInputPassword">비밀번호</label>
                <input type="password" class="form-control" id="exampleInputPassword" name="pwd">
            </div>
            <div class="form-group">
                <label for="exampleInputEmail">이메일</label>
                <input type="text" class="form-control" id="exampleInputEmail" name="email">
            </div>
            <button type="submit" class="btn btn-primary">수정하기</button>
        </form>
    </div>

 

 

그래서 이름과 아이디의 input 속성에 disabled를 넣고 수정하려고 했는데 오라클 에러가 떴다. 이유는 disabled로 하게되면 disabled된 input의 value를 가져오지 못한다.

 

따라서 수정하지 못하게하고 싶은 input value의 경우 disable이 아닌 readonly로 해줘야 한다. 

 

 <div class="container">
        <form action="/member/modifyMember.do" method="post">
            <div class="form-group">
                <label for="exampleInputName">이름</label>
                <input type="text" class="form-control" id="exampleInputName" value ="${member.name}" name="name" readonly>
            </div>
            <div class="form-group">
                <label for="exampleInputId">아이디</label>
                <input type="text" class="form-control" id="exampleInputId" value="${member.id}" name ="id"  readonly>
            </div>
            <div class="form-group">
                <label for="exampleInputPassword">비밀번호</label>
                <input type="password" class="form-control" id="exampleInputPassword" name="pwd">
            </div>
            <div class="form-group">
                <label for="exampleInputEmail">이메일</label>
                <input type="text" class="form-control" id="exampleInputEmail" name="email">
            </div>
            <button type="submit" class="btn btn-primary">수정하기</button>
        </form>
    </div>