javascript 글 수정 화면 구현

#230111

문제

게시물들이 있고 ‘수정’ 버튼을 눌렀을 때, 수정 내용을 입력할 수 있도록 만들고 싶다.

시도

팝업창을 띄워 수정할 내용을 입력받도록 prompt 함수 사용

prompt("수정할 내용을 입력해주세요.")

근데 별로 안 예쁘다..

해결

수정 버튼을 누르면, 수정할 부분의 입력창이 활성화되도록 만든다.
confirm 버튼을 숨겨놓고, 입력창을 비활성화 해두었다가 수정 버튼을 누르면 버튼이 보이고 입력창이 활성화되어 수정할 수 있다.

<p><button type="button" id="btn-confirm${num}" class="btnmodify" onclick="modify_confirm(${num})">confirm</button></p>
    
$('.btnmodify').hide()

숨겨진 버튼을 클릭하면 보여주는 함수

function modify_review(num){
    let text = num.toString()
 
    $("#txtfield"+text).attr("disabled", false)
    $("#btn-confirm"+text).show()
    $("#modifybtn"+text).hide()
    $("#deletebtn"+text).hide()
}

modify 버튼을 누르면 modify, delete 버튼은 사라지고 confirm 버튼이 나타나다.
입력창도 활성화된다.