2013-11-21 3 views
0

У меня есть таблица, в которой я динамически добавляю и удаляю строки. Это код, который я написал для этого.Показать окно предупреждения при удалении последней строки из таблицы

<SCRIPT TYPE="text/javascript"> 
var count = "2"; 
function addRow(in_tbl_name) 
{ 
var tbody = document.getElementById(in_tbl_name).getElementsByTagName("TBODY")[0]; 
// create row 
var row = document.createElement("TR"); 
// create first col 
var td1 = document.createElement("TD") 
var strHtml1 = "This is the line number " + count; 
td1.innerHTML = strHtml1.replace(/!count!/g,count); 
// create second col 
var td2 = document.createElement("TD") 
var strHtml2 = "<INPUT TYPE='Button' CLASS='Button' onClick='delRow()' VALUE='Delete Row'>"; 
td2.innerHTML = strHtml2.replace(/!count!/g,count); 

// append data to row 
row.appendChild(td1); 
row.appendChild(td2); 
// add to count variable 
count = parseInt(count) + 1; 
// append row to table 
tbody.appendChild(row); 
} 

function delRow() 
{ 
var current = window.event.srcElement; 
//here we will delete the line 
while ((current = current.parentElement) && current.tagName !="TR"); 
    current.parentElement.removeChild(current); 
} 
</SCRIPT> 

И вот код для элементов HTML.

<div id="container"> 
<INPUT TYPE="Button" onClick="addRow('tblPets')" VALUE="Add Row"> 

<TABLE ID="tblPets" border="1" STYLE="border width:1 orange dashed;background color:#F0E68C;table-row width:2;"> 

    <TR><TD>Frist col</TD><TD>Second col</TD></TR> 
    <TR><TD>This is the line number 1.</TD><TD><INPUT TYPE="Button" CLASS="Button" onClick="delRow()" VALUE="Delete Row"></TD></TR> 

</TABLE> 
</div> 

До сих пор все работает нормально. последний шаг, который я не могу придумать, как завершить, когда я удаляю каждую строку из таблицы, появится предупреждающее сообщение с сообщением alert("Table is empty");.

Как я могу это сделать? как я могу сделать свою функцию delRow(), чтобы понять, когда таблица становится полностью пустой?

Любая помощь будет высоко оценена.

+0

если (current.parentElement.rows.length == o) ... – mplungjan

ответ

0

вы можете попробовать это

if(document.getElementById("myTable").rows.length == 1) 
    alert("this is last row ") 
else if (document.getElementById("myTable").rows.length == 0) 
    alert("table is empty now ") 
0

на самом деле это был глупый вопрос меня .. я только что сделал это с помощью моей переменной счетчика ..

с этим простым, если

if (count == 1) 
    alert("Table is empty"); 
Смежные вопросы