0

以下は、テキストボックスとドロップダウンで行を動的に追加するコードです。

Javascript:

function addRow(tableID) {

    var table = document.getElementById(tableID);

    var rowCount = table.rows.length;
    var row = table.insertRow(rowCount);

    var colCount = table.rows[0].cells.length;

    for(var i=0; i<colCount; i++) {

        var newcell = row.insertCell(i);

        newcell.innerHTML = table.rows[0].cells[i].innerHTML;
        //alert(newcell.childNodes);
        switch(newcell.childNodes[0].type) {
            case "text":
                    newcell.childNodes[0].value = "";
                    break;

            case "select-one":
                    newcell.childNodes[0].selectedIndex = 0;
                    break;
        }
    }
}

HTML:

<body onload="load()">
    <INPUT type="button" value="Add Row" onclick="addRow('dataTable')" />
    <TABLE id="dataTable" width="350px" border="1">
        <TR>

            <TD><INPUT type="text" name="txt[]" id="t1"/></TD>
            <TD>
                <SELECT name="country[]" id="t2">
                    <OPTION value="in">India</OPTION>
                    <OPTION value="de">Germany</OPTION>
                    <OPTION value="fr">France</OPTION>
                    <OPTION value="us">United States</OPTION>
                    <OPTION value="ch">Switzerland</OPTION>
                </SELECT>
            </TD>
        </TR>
    </TABLE>
</BODY>

今、動的に追加されたフィールドから値をフェッチして、表形式で表示できるようにしようとしています。しかし、私はそれができる方法を手に入れていません。助けてください。

4

0 に答える 0