2010-05-04 56 views
0

我动态地构建我的HTML表从数据库 像HTML表中的一行:删除通过复选框marqued使用javascript

for (i = 0; i < nomCols.length; i++) { 
    retour.append(("<td bgcolor=#0066CC>") + nomCols[i] + "</td>"); 

} 
retour.append("</tr>"); 

retour.append("<tr>"); 

try { 

    s = HibernateUtil.currentSession(); 
    tx = s.beginTransaction(); 
    Query query = s.createQuery(HQL_QUERY); 

    for (Iterator it = query.iterate(); it.hasNext();) { 
     if (it.hasNext()) { 
      Dailytimesheet object = (Dailytimesheet) it.next(); 
      retour.append("<td><input type=checkbox name=cb id=cb /> </td>"); 
      retour.append("<td>" + object.getTrackingDate() + "</td>"); 
      retour.append("<td>" + object.getActivity() + "</td>"); 
      retour.append("<td>" + object.getProjectCode() + "</td>"); 
      retour.append("<td>" + object.getWAName() + "</td>"); 
      retour.append("<td>" + object.getTaskCode() + "</td>"); 
      retour.append("<td>" + object.getTimeSpent() + "</td>"); 
      retour.append("<td>" + object.getPercentTaskComplete() + "</td>"); 
     } 
     retour.append("</tr>"); 


    } 

    retour.append("</table>"); 
    tx.commit(); 


} catch (HibernateException e) { 
    retour.append("</table><H1>ERREUR:</H1>" + e.getMessage()); 
    e.printStackTrace(); 
} 

return retour; 
} 

所以我想具有相同ID的所有复选框。 当试图删除我的表中的一行女巫有复选框检查我发现一个问题。 荫使用简单的JavaScript这样的:

function DeleteARow() { 
    //var Rows = document.getElementById('sheet').getElementsByTagName('tr'); 
    //var RowsCount = Rows.length; 
    //alert('Your table has ' + RowsCount + ' rows.'); 
    if (document.getElementById('cb').checked == true) { 

     document.getElementById('cb').parentNode('td').parentNode('tr').remove(); 

    } 
} 

它不工作approperly,只有第一行有ID为“CB”。

非常感谢您的帮助。

回答

2

ID的要点是可以只有一个。您不能有多个元素具有相同的ID

getElementByID将仅返回具有该ID的第一个元素。

我建议你改用CSS类。

这里有一个方法可以遍历谁拥有class="cb"复选框:

var j, elements = document.getElementsByTagName("INPUT"); 
for (j = 0;j < elements.length;j += 1) { 
    if (elements[j].className === 'cb' && elements[j].checked === true) { 
     // elements[j] is your checkbox 
    } 
} 

如果你想花时间去学习像jQuery的时候,你可以让这整个任务更容易:

$( 'CB:检查')父()父()删除();。

编辑

$('.cb:checked').closest('tr').remove(); 
+1

'$( 'CB:检查 ')最近(' TR')删除();':) – 2010-05-04 10:20:57

+0

@Nick很好抓,感谢 – Matt 2010-05-04 10:23:07

+0

怎么可能。我宣布class =“cb”,并在哪里? – kawtousse 2010-05-04 11:05:50