0

フォームから情報を取得してサーバー上の csv に保存するスクリプトについて頭を悩ませています。問題は、複数のテーブルを含むフォームがあることです。これらのテーブルには、別の行を追加するための「+」ボタンがあります。そのためにjqueryを使用しています。これは正常に機能し、行の量を非表示の入力に保存し、テキストエリア名に _0、_1、_2 を割り当てます。

ユーザーが追加する行数に応じて、PHP を使用して変数をこれらに動的に割り当てる方法が本当に混乱しています。これは私のフォームです:

<table style="width:100%;" id="directEmployees">
<tbody>
    <tr>
        <td>Name</td>
        <td>Time Start</td>
        <td>Time Finish</td>
        <td>Job Description</td>
        <td>Plant/Machinery Issued/Used</td>
        <td>P.P.E Issued?</td>
        <td>Materials Issued/Used</td>
    </tr>
    <tr>
        <td width="20%"><textarea style="width:100%;" name="directName_0" id="directName_0"></textarea></td>
        <td width="10%"><textarea style="width:100%;" name="directTimeStart_0" id="directTimeStart_0"></textarea></td>
        <td width="10%"><textarea style="width:100%;" name="directTimeEnd_0" id="directTimeEnd_0"></textarea></td>
        <td width="20%"><textarea style="width:100%;" name="directJob_0" id="directJob_0"></textarea></td>
        <td width="15%"><textarea style="width:100%;" name="directPlant_0" id="directPlant_0"></textarea></td>
        <td width="10%"><textarea style="width:100%;" name="directPPE_0" id="directPPE_0"></textarea></td>
        <td width="15%"><textarea style="width:100%;" name="directMaterials_0" id="directMaterials_0"></textarea></td>
    </tr>
</tbody>
</table>
<h2 id="addEmployee" style="cursor:pointer;">+</h2>

<button type="submit">Submit</button>

</form>

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">

$(document).ready(function(){
    var additional_rows = 0;
    $('#addEmployee').click(function() {
        additional_rows = additional_rows + 1;
        $('#rowsEmployee').val(additional_rows);

        var addTable = '<tr><td width="20%"><textarea style="width:100%;" name="directName_' + additional_rows + '" id="directName_' + additional_rows + '"></textarea></td><td width="10%"><textarea style="width:100%;" name="directTimeStart_' + additional_rows + '" id="directTimeStart_' + additional_rows + '"></textarea></td><td width="10%"><textarea style="width:100%;" name="directTimeEnd_' + additional_rows + '" id="directTimeEnd_' + additional_rows + '"></textarea></td><td width="20%"><textarea style="width:100%;" name="directJob_' + additional_rows + '" id="directJob_' + additional_rows + '"></textarea></td><td width="15%"><textarea style="width:100%;" name="directPlant_' + additional_rows + '" id="directPlant_' + additional_rows + '"></textarea></td><td width="10%"><textarea style="width:100%;" name="directPPE_' + additional_rows + '" id="directPPE_' + additional_rows + '"></textarea></td><td width="15%"><textarea style="width:100%;" name="directMaterials_' + additional_rows + '" id="directMaterials_' + additional_rows + '"></textarea></td></tr>';

        $('#directEmployees tbody').append(addTable);
    });
});

</script>

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

4

2 に答える 2