0

次のコードがあります。ここで、[追加]ボタンをクリックしてテーブルに新しい行を取得したいのです が、問題はすべてのテキストフィールドを同じセルに取得できることです..

誰かが私がここで犯した間違いを教えてもらえますか?

HTML:

<h3> Adding Next Rows </h3>

<div class="common" style="width:1040px; -overflow-x:scroll; padding: 5px 5px 0 5px;">
<table id="maintable" width="50%" cellpadding="0" cellspacing="0" class="pdzn_tbl1"
border="#729111 1px solid">
    <tr>
        <th align="center">Roll No</th>
        <th align="center">First Name</th>
        <th align="center">Last Name</th>
    </tr>
    <?php $t_row=3; for($i=1;$i<=$t_row;$i++) { ?>
    <tr id="rows">
        <div style="padding-left: 5px">
            <td style="padding:5px;">
                <input type="text" name="rollno<? $i ?>" />
            </td>
            <td style="padding:5px;">
                <input type="text" name="firstname<? $i ?>" />
            </td>
            <td style="padding:5px;">
                <input type="text" name="lastname<? $i ?>" />
            </td>
        </div>
    </tr>
    <? } ?>
    <div id="addgroup">
        <div id="add_div1"></div>
        <table>&nbsp;
            <br />
            <input type="button" name="add" value="+Add" id="addrows" style="color:#3300FF; font-size:16px; "
            />
            <input type="hidden" id="hiddenprice" name="hiddenprice" value="3" />
        </table>
    </div>

JQuery:

var $ = jQuery.noConflict();
$("#addrows").click(function () {
if (document.getElementById("hiddenprice").value == "") {
    imagecounter = 4;
} else {
    imagecounter = parseFloat(document.getElementById("hiddenprice").value) + 1;
}

//imagecounter=4;       
var newImageDiv = $(document.createElement('div'))
    .attr("id", 'add_div' + imagecounter);

/*onchange="return fn_productname(this.value,\'prdname'+imagecounter+'\')"*/

newImageDiv.after().html('<table width="100%" cellpadding="0" cellspacing="0" class="pdzn_tbl1" border="0">' + '<tr>' + '<td style="padding:5px;" >' + '<input type="text" name="rollno<? $i ?>"  />' + '</td>' + '<td style="padding:5px;">' + '<input type="text" name="firstname<? $i ?>" />' + '</td>' + '<td style="padding:5px;">' + '<input type="text" name="lastname<? $i ?>" />' + '</td>' + '</tr>' + '</table>');

newImageDiv.appendTo("#maintable");

document.getElementById("hiddenprice").value = imagecounter;
imagecounter++;

});

これが私のjsfiddleページです。

4

2 に答える 2

1

デモはこちら

JSFIDDLE デモ

$("#add_new").click(function () { 

    $("#maintable").each(function () {

        var tds = '<tr>';
        jQuery.each($('tr:last td', this), function () {
            tds += '<td>' + $(this).html() + '</td>';
        });
        tds += '</tr>';
        if ($('tbody', this).length > 0) {
            $('tbody', this).append(tds);
        } else {
            $(this).append(tds);
        }
    });
});
于 2013-10-01T11:09:28.867 に答える