2012年6月7日木曜日

【JavaScript】ボタンでテーブルの行追加

function addRow() {
    var tb= document.getElementById("newRow");
    var tr = document.createElement('tr');

    var td1 = document.createElement('td');
    var input1 = makeInput("NAME[]", 30, 30);
    td1.appendChild(input1);
    tr.appendChild(td1);

    var td2= document.createElement('td');
    var input2= makeInput_checkbox("KBN[]");
    td2.appendChild(input2);
    tr.appendChild(td2);
}

function makeInput(name, size, maxlength) {
    var node = document.createElement('input');
    node.type = 'text';
    node.name = name;
    node.id = name;
    node.size = size;
    node.maxlength = maxlength;
    return node;
}
function makeInput_checkbox(name) {
    var node = document.createElement('input');
    node.type = 'checkbox';
    node.name = name;
    node.id = name;
    node.value = 0; ←これ入れないと値がon/offになってた?
    return node;
}






ボタン↓
onclick="addRow();"

<table>
<tr>
<td>名前</td>
<td>無効区分</td>
</tr>
<tbody id="newRow">
</tbody>
</table>