0

現在、アコーディオン内のユーザー入力を配列に保存しています。

私のアコーディオンは動的で、クリックすると、入力フィールドを持つ別のアコーディオン列が作成されます。

var i = 1 ;
        function AddPanel()
        {
        $('.accord').append('<h3 style="background:none;background-color:#C8C8C8  ;">Job Nr.'+i+'</h3>'
            +'<div style="background:none;background-color:#E0E0E0;">'
                +'<div>'
                    +'<form name="myForm">'
                        +'<table class="wrapper">'
                            +'<tr>'
                                +'<td style="text-align: left">First Digit:'
                                +'<div> <input type="text" name="Job['+i+'][0]" /></td>'
                                +'<td style="text-align: left">System:'      
                                +'<div> <input  type="text" name="Job['+i+'][1]" /></td>'
                                +'<td style="text-align: left">SAP Modul:'  
                                +'<div> <input  type="text" name="Job['+i+'][2]" /></td>'
                            +'</tr>'
                            +'<tr>'
                                +'<td style="text-align: left">Country:' 
                                +'<div> <input  type="text" name="Job['+i+'][3]" /></td>'
                                +'<td style="text-align: left">Duration:' 
                                +'<div> <input  type="text" name="Job['+i+'][4]" /></td>'
                                +'<td style="text-align: left">Step Number:' 
                                +'<div> <input  type="text" name="Job['+i+'][5]" /></td>'
                            +'</tr>'
                            +'<tr>'
                                +'<td style="text-align: left">Optional Text:'
                                    +'<div>' 
                                    +'<textarea align="left" name="Job['+i+'][6]" cols="20" rows="2"></textarea>'
                                    +'</div>'
                                +'</td>'
                            +'</tr>'
                        +'</table>'
                    +'</form>'
                +'</div>'
            +'</div>')
        $('.accord').accordion("refresh"); 
        i++;
        }

理論的には、ユーザーは数百の入力を 2D 配列に動的に作成できます。

私の質問は次のとおりです。サイクル内の2次元配列のすべての入力を保存して後で取得するにはどうすればよいですか?

私は嘘をついてみました。

        var form = document.getElementsByName('myForm');
        field = form.elements['Job[0][0]'];
        formData = [], i = 0, j = 0;

        while (field) {
        formData[i] = [];
        j = 0;
        while (field) {
        formData[i].push(field.value);
        field = form.elements['Job[' + i + '][' + (++j) + ']'];
        }
        field = form.elements['Job[' + (++i) + '][0]'];
        }
        console.dir(formData);
        `

私はこれをさまざまな方法で試し、何時間もグーグルで検索しましたが、うまくいきません。

申し訳ありませんが、私はこれで本当の初心者です。

前もって感謝します！

4

2 に答える 2

0

できることのデモ (例) を作成しました。基本的な考え方 (私の理解が正しければ) は、次のようにループ インデックスを使用してフォーム フィールドに名前を付けることです。

<input type="text" name="Job[0][0]"/>
<input type="text" name="Job[0][1]"/>

したがって、最初の数字はグループ/セットのインデックスになり、2 番目の数字はそのグループ/セット内のフィールド インデックスになります。

それよりも - これらのフィールドをループするだけで、セットまたはセット内のフィールドの数に関係なく、配列内のすべての値を収集できます。次に例を示します。

var form = document.getElementById('myForm'),
    field = form.elements['Job[0][0]'],
    formData = [], i = 0, j = 0;

while (field) {
    formData[i] = [];
    j = 0;
    while (field) {
        formData[i].push(field.value);
        field = form.elements['Job[' + i + '][' + (++j) + ']'];
    }
    field = form.elements['Job[' + (++i) + '][0]'];
}

console.dir(formData);

ここでは jquery を使用しませんでした (jquery を使用するとさらに簡単になります)。

これはあなたが探しているものですか？

デモ

于 2013-07-26T08:29:28.927 に答える