2009-05-18 7 views
0

追加ボタンをクリックすると、テーブルに行が追加されます。JavaScriptのボタンをクリックするとプロパティ名が動的に変更されます

各行には、名前、クラス、年のテキストボックスが含まれています。

1行目のプロパティ名は...... name_1、class_1、year_1になります。
2行目のプロパティ名は、...... name_2、class_2、year_2となります。私は第一行(NAME_1、class_1、year_1)を削除した場合

、第二列のプロパティ名にはなるべき

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

私はこれをどのように行うことができますか?

答えて

0

私はクライアント側でそれをやっても構いません。サーバー側のコードでは、キーがPOST配列に存在するかどうかを確認するだけです。

それでも要素の名前を変更したい場合:

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; 
} 
0

あなたはこのような何か行うことができます(未テスト、すべきではかなり多くの仕事を...)

「デリゲート」の内側の方法がする必要があり行のスコープを維持する。

セットアップ:

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

追加行:

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); 
} 
関連する問題