1

重複の可能性：
jQueryを使用して新しい行をテーブルに追加し、それに増分IDを割り当てる方法

以下のようにいくつかのテーブル行があります： 

<td><input id="RS_Staff_Title1" name="RS_Staff_Title1" style="width:100%;"></td>

<td><input id="RS_No_WD_Staff1" name="RS_No_WD_Staff1" style="width:100%;"></td>

<td><input id="RS_No_Weekdays1" name="RS_No_Weekdays1" style="width:100%;"></td>

<td><input id="RS_No_WE_Staff1" name="RS_No_WE_Staff1" style="width:100%;"></td>

<td><input id="RS_No_WE_Days1" name="RS_No_WE_Days1" style="width:100%;"></td>

<td><img class="remove_row" src="assets/images/delete-icon.png"></td>

次に、最後のテーブル行を取得して下の行に複製するボタンがあります。したがって、このJqueryを使用して新しい行を追加します。」

$("#add_row").click(function() {
        $('#staff tbody>tr:last').clone(true).insertAfter('#staff tbody>tr:last');
        return false;
    });

私が行う必要があるのは、RS_Staff_Title1がRS_Staff_Title2、RS_Staff_Title3などになることです。他の列でも同じことが起こります。

どうすればこれを達成できますか？

4

5 に答える 5

4

考えられる解決策の1つ：

$("#add_row").click(function() {
    var row = $("#staff tbody > tr:last"),
        newRow = row.clone(true);

    newRow.find("input").each(function() {
        var num = +(this.id.match(/\d+$/) || [0])[0] + 1;
        this.id = this.id.replace(/\d+$/, "") + num;
        this.name = this.id;
    });

    newRow.insertAfter(row);
    return false;
});

デモ：http： //jsfiddle.net/GHTN7/

于 2012-10-03T08:21:57.160 に答える
1

あなたはこれを試すことができます

$("#add_row").click(function() {
    $('#staff tbody>tr:last').clone(true).insertAfter('#staff tbody>tr:last')
    .find('input').attr({'name':'RS_Staff_Title'+$('#staff tbody>tr').length, 'id':'RS_Staff_Title'+$('#staff tbody>tr').length
    });
});

デモ。

于 2012-10-03T08:25:56.793 に答える
0

入力のIDが必要ない場合は、配列を使用でき、HTMLによって増分番号が割り当てられます。

<td><input name="RS_Staff_Title[]" style="width:100%;"></td>

<td><input name="RS_No_WD_Staff[]" style="width:100%;"></td>

<td><input name="RS_No_Weekdays[]" style="width:100%;"></td>

<td><input name="RS_No_WE_Staff[]" style="width:100%;"></td>

<td><input name="RS_No_WE_Days[]" style="width:100%;"></td>

<td><img class="remove_row" src="assets/images/delete-icon.png"></td>
于 2012-10-03T08:19:39.910 に答える
0 
$('#staff tbody>tr:last').clone(true).appendTo('#staff tbody>tr:last');
于 2012-10-03T08:21:50.067 に答える
0

これを試して

var j = 1;
var arr = ["RS_Staff_Title", "RS_No_WD_Staff", "RS_No_Weekdays", "RS_No_WE_Staff", "RS_No_WE_Days"]
$("#add_row").click(function() {
    j++;
    var $last = $('#staff tbody>tr:last');
    $last.clone(true).insertAfter('#staff tbody>tr:last');
    // Chaching it again to conter for the newly added Row...
    $last = $('#staff tbody>tr:last');
    // Selecting all the td's in the newly added row..
    var $td = $('#staff tbody>tr:last td');
    $.each(arr, function(i) {
        if(i > 4)
        return false;

       $($td[i]).find('input').attr('id' , (arr[i] + j ));
        $($td[i]).find('input').attr('name' , (arr[i] + j ));
        // Not considering the Images
    });
    return false;
});​

FIDDLEを確認してください

于 2012-10-03T08:40:46.420 に答える