2013-08-30 3 views
2
<script type="text/javascript"> 
    Array.prototype.AddRecord = function() { 

     document.getElementById('mytable').style.display = "block"; 
     table 
     var table = document.getElementById("mytable"); 
     var rows = table.rows.length; 

     var row = table.insertRow(rows++); 
     var cell1 = row.insertCell(0); 
     var cell2 = row.insertCell(1); 
     var cell3 = row.insertCell(2); 
     var cell4 = row.insertCell(3); 
     var cell5 = row.insertCell(4); 

     //alert(row.id); 
     var name = this[0]; 
     var age = this[1]; 

     var param = "editrow(\'" + name + "\'," + age + "," + rows + ")"; 
     var param1 = "deleterow(" + rows + ")"; 
     var param2 = "Update(\'" + name + "\'," + age + "," + rows + ")"; 

     cell1.innerHTML = name; 
     cell2.innerHTML = age; 
     cell3.innerHTML = "<input type='button' value='Edit' id='edit' onclick=" + param + " >"; 
     cell4.innerHTML = "<input type='button' value='Delete' id='delete' onclick=" + param1 + ">"; 
     cell5.innerHTML = "<input type='button' value='Update' id='update' onclick=" + param2 + ">"; 

    } 

    function Update(name, age, row) { 
     alert(name); 
     alert(age); 
     alert(row); 
     document.getElementById('create').style.display = "none"; 
     document.getElementById('update').style.display = "block"; 

    } 
</script> 

tr id 인 행 ID에 따라 행을 업데이트하고 tr 셀 데이터를 업데이트하려면 초보자입니다 ... 고맙습니다. 사전에 ...tr id in javascript를 사용하여 tr innerHTML 업데이트

+0

함수를 업데이트하기 위해 행 ID 또는 행 번호를 전달하고 있지만 자식 노드 또는 셀 데이터를 업데이트하는 방법을 모릅니다 ... – user2699972

+0

어디에서 문제가 발생합니까? 그런데, 테이블과 셀의'display' 타입을 변경하는 것은 결코 좋은 생각이 아닙니다. 그대로 ('table','table-cell' 등) 그대로 사용하고 대신'visibility' 속성을 사용하십시오. –

+0

많은 레코드가 추가되고 특정 레코드 – user2699972

답변

0

그건 jQuery의 문제입니다. 당신은 그것에 중독 될 것입니다. 어쨌든 여기 원시 자바 스크립트 솔루션입니다 :

여기에 키는 나중에 가져올 수 있도록 행에 ID를 할당하는 것입니다.

http://jsfiddle.net/PnMPk/1/ < < 작업 예제.

updateMethod = function (nm, age, rowID){ 
    //alert('Changing Name of :' + rowID); 
    var o = getO(rowID); 
    o.children[0].innerText = 'Changed'; 
    o.style.color = 'red'; 
}; 

//getO => 
var getO = function(_id){ 
    return document.getElementById(_id); 
}; 

Array.prototype.AddRecord = function() { 
getO('mytable').style.display = "block"; 
     table 
     var table = getO("mytable"), 
      rows = table.rows.length, 
      row = table.insertRow(rows++), 
      cell1 = row.insertCell(0), 
      cell2 = row.insertCell(1), 
      cell3 = row.insertCell(2), 
      cell4 = row.insertCell(3), 
      cell5 = row.insertCell(4), 
      rowID = 'row_'+ table.rows.length; 

     row.setAttribute('id', rowID); //Assign some ID 

     var name = this[0], 
      age = this[1], 
      param = "editrow(\'" + rowID + "\'," + age + "," + rows + ")", 
      param1 = "deleterow(" + rowID + ")", 
      param2 = "updateMethod(\'" + name + "\'," + age + ",'" + rowID + "')"; 

     cell1.innerHTML = name; 
     cell2.innerHTML = age; 
     cell3.innerHTML = "<input type='button' value='Edit' id='edit' onclick=" + param + " >"; 
     cell4.innerHTML = "<input type='button' value='Delete' id='delete' onclick=" + param1 + ">"; 
     cell5.innerHTML = "<input type='button' value='Update' id='update' onClick=" + param2 + ">"; 


    }; 

['rakesh',26].AddRecord(); 
['juyal',28].AddRecord(); 
['Click',26].AddRecord(); 
['update',28].AddRecord(); 
['CHANGE_NAME',28].AddRecord(); 

수정이 필요하면 알려주세요.