수정 버튼 클릭시 정보 수정하는 스크립트

function changeBtn(id) {


    event.preventDefault();

    var btn = document.getElementById("changeBtn_" + id)

    var btn_confirm = btn.nextSibling.nextSibling;

    var btn_delete = btn_confirm.nextSibling.nextSibling;


    btn.style.display = "none";

    btn_confirm.style.display = "";

    btn_delete.style.display = "";


    var data_tr = document.getElementById("databox_" + id);

    console.log(data_tr);

    console.log(data_tr.children);


    for(var i = 1; i < 6; i++) {

        console.log(data_tr.children[i]);

        var content = data_tr.children[i].innerHTML;


        data_tr.children[i].innerHTML = "";

        if (i < 3) {

            data_tr.children[i].innerHTML = "<input type='text' value='" + content + "'>";

        } else if(i === 3) {


        } else if(i === 4) {

            data_tr.children[i].innerHTML = "<input type='text' value=''>";

        } else if(i === 5) {

            data_tr.children[i].innerHTML = "<select name='update_auth'><option selected>==선택==</option><option >관리자</option><option>사원</option></select>";

        }

    }


    console.log(data_tr.children);


    var name = data_tr.children;

    name[1].firstChild.setAttribute('name', 'update_name');

    name[2].firstChild.setAttribute('name', 'update_rank');

    name[3].firstChild.setAttribute('name', 'update_hire');

    name[4].firstChild.setAttribute('name', 'update_fire');


}

 

1. 수정 btn 클릭

2. 저장, 삭제 btn 생성

3. 이미 존재하는 태그의 data를 변수에 저장

4. 변수에 담긴 data를 value 값으로 input 태그 생성

5. 기존 태그 삭제

6. input태그에 value, name을 지정해주고 form 전송