parentNode.parentNode.rowindex zum löschen einer Zeile in einer dynamischen Tabelle

Ich bin meinen Zeilen dynamisch, wenn der Benutzer klickt auf "Ajouter".

     <?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html>
<head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 <script>
   function getXhr(){
                var xhr = null; 
                if(window.XMLHttpRequest) //Firefox and others
                   xhr = new XMLHttpRequest(); 
                else if(window.ActiveXObject){ //Internet Explorer 
                   try {
                            xhr = new ActiveXObject("Msxml2.XMLHTTP");
                        } catch (e) {
                            xhr = new ActiveXObject("Microsoft.XMLHTTP");
                        }
                }
                else { //XMLHttpRequest not supported by your browser
                   alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest..."); 
                   xhr = false; 
                } 
                                return xhr
            }

        /**
        *  method called when the user clicks on the button
        */
        function go(){
            var xhr = getXhr()
            //We defined what we gonna do with the response
            xhr.onreadystatechange = function(){
                //We do somthing once the server's response is OK
                if(xhr.readyState == 4 && xhr.status == 200){
                    //alert(xhr.responseText);
                    var body = document.getElementsByTagName("body")[0];

                //Retrieve <table> ID and create a <tbody> element

                    var tbl = document.getElementById("table");
                    var tblBody = document.createElement("tbody");
                    var row = document.createElement("tr");

                //Create  <td> elements and a text node, make the text
                //node the contents of the <td>, and put the <td> at
                //the end of the table row
                    var cell_1 = document.createElement("td");
                    var cell_2 = document.createElement("td");
                    var cell_3 = document.createElement("td");
                    var cell_4 = document.createElement("td");

                //Create the first cell which is a text zone   
                    var cell1=document.createElement("input");
                    cell1.type="text";
                    cell1.name="fname";
                    cell1.size="20";
                    cell1.maxlength="50";
                    cell_1.appendChild(cell1);

                //Create the second cell which is a text area  
                    var cell2=document.createElement("textarea");
                    cell2.name="fdescription";
                    cell2.rows="2";
                    cell2.cols="30";
                    cell_2.appendChild(cell2);

                    var cell3 = document.createElement("div");
                    cell3.innerHTML=xhr.responseText;
                    cell_3.appendChild(cell3);


                //Create the fourth cell which is a href
                    var cell4 = document.createElement("a");
                    cell4.appendChild(document.createTextNode("[Delete]"));
                    cell4.setAttribute("href","javascrit:deleteRow();");
                    cell_4.appendChild(cell4);


                //add cells to the row
                    row.appendChild(cell_1);
                    row.appendChild(cell_2);
                    row.appendChild(cell_3);
                    row.appendChild(cell_4);


                //add the row to the end of the table body
                    tblBody.appendChild(row);

                //put the <tbody> in the <table>
                    tbl.appendChild(tblBody);
                //appends <table> into <body>
                    body.appendChild(tbl);
                //sets the border attribute of tbl to 2;
                    tbl.setAttribute("border", "1");
            }

                }

            xhr.open("GET","fstatus.php",true);
            xhr.send(null);
        }

</head>
<body >
<h1> Create an Item </h1>
<form method="post">
    <table align="center" border = "2" cellspacing ="0" cellpadding="3" id="table"> 
        <tr><td><b>Functionality Name:</b></td> <td><b>Description:</b></td> <td><b>Status:</b></td> <td><input type="button" Name= "Ajouter" Value="Ajouter" onclick="go()"></td></tr>

    </table>    

</form> 
</body>
</html>

Nun möchte ich das href - [Löschen] zum löschen einer bestimmten Zeile.

Schrieb ich dies:

    <script type="text/javascript">
function deleteRow(r){
var i=r.parentNode.parentNode.rowIndex;
document.getElementById('table').deleteRow(i);
}
</script>

Wenn ich den ersten code wie folgt: cell4.setAttribute("href","javascrit:deleteRow(this);");

Ich bekam eine Fehlermeldung: Die Seite kann nicht angezeigt werden. Ich bin umgeleitet, um eine neue pagewhich kann nicht angezeigt werden.

Wie konnte ich löschen meiner Reihe über die Funktion deleteRow(r)?
Tabelle ist die id von meinem Tisch

  • cell4.setAttribute("href","javascrit:deleteRow(this);"); ==> Sie fehlt der 'p' in 'javascript'. Wenn das in deinem code, ist das dein problem.
  • Es ist nicht so, dass Rechtschreibfehler ist es (javascrit:...)? cell4.setAttribute("href","javascrit:deleteRow(this);");
  • Oh ich danke Euch so sehr. Ich bin echt doof manchmal.
InformationsquelleAutor billy85 | 2009-06-24
  1. 0

    Überprüfen Sie die url unten :
    http://www.tek-tips.com/viewthread.cfm?qid=1232357&page=1

    • Poste bitte die Antworten als eine Antwort, wenn Sie nicht erlaubt, kann die ganze Antwort, dann zusammenfassen, was Sie verknüpfen, und verwenden Sie die externe Website als Ressource, nicht die Gesamtheit der Antworten. Bei der sehr zumindest erklären warum wir sollten schauen, dass URL.
    InformationsquelleAutor JQuery Guru
Schreibe einen Kommentar