0

ユーザーが選択した行を追加および削除できる単純なフォームを作成しました。ユーザーが追加する行数を決定し、それに応じてフォームにデータを入力した後、送信後にデータを投稿して、.php スクリプトを使用してデータをサーバーにアップロードできるようにします。

行の追加と削除の機能をテストしました。送信ボタンをクリックすると、upload.php にリダイレクトされますが、そのページに「未定義のインデックス: 報酬」というエラーが表示され、データが適切に送信されていないと思われます。

以下の実装に問題はありますか?

HTML 

<button onclick="addRow();">Add Row</button>
<form method="post" action="upload.php">
    <table border="1" id="optionsTable">
        <tr>
        <td>Header1</td>
        <td>Header2</td>
        <td>Delete</td>
        </tr>

        <tr id="templateRow" style="display:none">
        <td><input type="text" id="reward" /></td>
        <td><input type="text" id="duration" /></td>
    <td><input type="button" id="deleteOption" value="Delete"     onclick="delRow(this)"/></td>
        </tr>
    </table>

    <input type="submit" value="Submit" />
</form>

</body>
</html>

<script>
var maxID = 0;
function getTemplateRow() {
    var x = document.getElementById("templateRow").cloneNode(true);
    x.id = "";
    x.style.display = "";
    x.innerHTML = x.innerHTML.replace(/{id}/, ++maxID);
    return x;
}
function addRow() {
    var t = document.getElementById("optionsTable");
    var rows = t.getElementsByTagName("tr");
    var r = rows[rows.length - 1];
    r.parentNode.insertBefore(getTemplateRow(), r);
}
function delRow(row) {
    var i=row.parentNode.parentNode.rowIndex;
    document.getElementById('optionsTable').deleteRow(i);
}

</script>

私は今、upload.php でデバッグしているだけなので、コマンドは 1 つしかありません: echo($_POST['reward']);

どんな助けでも大歓迎です。

4

2 に答える 2

3

入力には属性が必要ですname。例えば：

<input type="text" id="reward" name="reward" />

于 2013-02-04T07:39:58.387 に答える
3

入力用の名前を定義する必要があります。

<input type="text" id="reward" />

に

<input type="text" id="reward" name="reward"/>
于 2013-02-04T07:40:20.243 に答える