Dynamische Änderung des Namens der Eigenschaft beim Klicken auf die Schaltfläche in JavaScript

Question

Ich füge Zeilen in einer Tabelle beim Klicken auf eine Schaltfläche Hinzufügen hinzu.

Jede Zeile enthält Name, Klasse, Jahr Textfelder.

In der ersten Zeile lautet der Name der Eigenschaft ...... name_1, class_1, year_1.
In der zweiten Zeile lautet der Name der Eigenschaft ...... name_2, class_2, year_2.

Wenn ich die erste Zeile (name_1, class_1, year_1), die zweite Zeile des Eigenschaftsnamen

name_2,class_2,year_2 <==> name_1,class_1,year_1 

Wie kann ich dies tun werden sollte löschen?

Answer 1

Ich würde mich nicht damit auf der Client-Seite tun. Überprüfen Sie in Ihrem serverseitigen Code, ob der Schlüssel im POST-Array vorhanden ist.

Wenn Sie noch die Elemente umbenennen möchten:

var f = document.myForm; 
var removeThisOne = 3; 
var current = removeThisOne + 1; 

while (f['name_' + current]) { 
    f['name_' + current].name = 'name_' + (current - 1); 
    f['class_' + current].name = 'class_' + (current - 1); 
    // etc 
    ++current; 
} 

Answer 2

Sie so etwas tun könnte (ungetestet, sollte ziemlich viel Arbeit ...)

Die ‚delegieren‘ innere Verfahren erforderlich Umfang in der Zeile beibehalten

Setup:

var table = document.createElement('table'); 
var tbody = document.createElement('tbody'); 
table.appendChild(tbody); 
document.appendChild(table); // or wherever you want it. 

Zeile hinzufügen:

function clickHandler(row) 
{ 
    function delegate() 
    { 
     tbody.removeChild(row); 
    } 
    return delegate; 
} 
for (var i in someObj) 
{ 
    var row = document.createElement('tr') 
    var td1 = document.createElement('td'); 
    var td2 = etc... 

    td1.innerHTML = someObj[i].field1; 
    row.appendChild(td); 
    td2 = etc... 

    var del = document.createElement("input"); 
    input.type="button"; 
    input.value = "delete"; 
    input.onclick = clickHandler(row); 
    tdX.appendChild(del); 

    tbody.appendChild(row); 
}