2

新しいコンテンツが追加されると自動成長するリストを作成しました。これは、兄弟と年齢を追加できるようにするための簡単な例です（ここではhttp://jsfiddle.net/j08691/bhamUです）。コードに送信ボタンを追加し、処理するURLに送信しています。

HTML：

<form>
<div class="family">
    <input name="age" value=0>  <input name="sibling" value="name?">
    <hr />
</div>
</form>

Javascript：

$("form").on('keydown',"input[name='age']:last", function() {
    $('.family:last').clone().insertAfter(".family:last");
})

問題は、私が次のように入力した場合です。

 Bob - 25 
 Cindy - 24 
 Greg - 26

私が得た結果は次のとおりです。

 Greg - 26
 Greg - 26
 Greg - 26

結果の数は常に私が入力した兄弟の数と同じですが、実際の結果は常に最後に繰り返されたエントリです。（私はPyramidを使用しており、request.POSTコマンドを使用して何が投稿されているかを確認しています）。

これは、2つの入力のクローンを作成していて、それらの名前が繰り返されているためかどうか疑問に思います。クローン作成後にフォームを識別できるようにするためにすべきことはありますか？

私はこれを使用してデータを取得しています：

def submitchange(request):
    for x in request.POST:
        print x, ' = ', request.POST[x]

正しい入力数を出力しますが、すべての項目は最後のエントリと重複しています。

4

3 に答える 3

4

これは、属性が類似しているため、クローン作成後に属性nameを変更する必要があります。nameこれを試して：

<form>
<div class="family">
    <input name="age_1" value=0>  <input name="sibling1" value="name?">
    <hr />
</div>
</form>


$("form").on('blur',"input[name^='age']:last", function() {
    var name = parseInt(this.name.slice(-1), 10)
    $('.family:last').clone().insertAfter(".family:last");
    $('.family:last').find('input[name^="age"]').attr('name', 'age_'+(name+1)).val("")
})

デモ

于 2012-07-17T22:55:30.617 に答える
4

さて、あなたの元のコードは非常に機能的であり、受け入れられた答えは最適ではないと言って残念です。つまり、今は機能するかもしれませんが、アイテムを削除して並べ替える機能を追加することにしたと想像してください。各操作の後にフォーム内の要素の番号を付け直す必要があります。これにより、クライアント。

次に、サーバー上で、POSTですべての "name_1"、 "name_2"、..."name_n"パラメーターを検索する必要があります...そうでない方法でこれを行う方法がわかりません。 ..エラー...魅力的ではありません。たぶん、行の総数を含むフォームで非表示の変数を渡す必要がありますか？それは問題を少し単純化するでしょう。

とにかく、これが本物の忍者がこれを行う方法です：

  1. フォームが送信されたときに、同じ名前のコントロールがフォームに複数存在する場合、それらはすべてサーバーに送信されます。HTTP仕様では、これをチェックボックスに対してのみ明示的に指定していますが、仕様の残りの部分を読み取ると、他のコントロールに対しても暗黙的にこれが許可されます。とにかく、すべてのブラウザは複数のコントロールに対して複数の名前と値のペアを送信します。これはFirebugを使用するか、formメソッドをGETに変更するだけで確認できます。URLは次のようになります?name=John+Smith&name=Joann+Smith&name=Bob+Smith。要素は、フォームに表示される順序で送信されることも保証されています。Pyramidのdeformフォームライブラリは、この事実に大きく依存しています（peppercornライブラリを介してですが、これはタスクに必要なことではありません）。

  2. ピラミッドリクエストのPOST属性とGET属性は辞書のように見えるかもしれませんが、実際にはMultiDictクラスのインスタンスです。これは、特定のキーに複数の値を含めることができるdictのようなものです。

request.POST ['param_name']にアクセスすると、MultiDictはリストに追加された最後の「スカラー」値を返します。フォームで複数の値が検出された場合は自動的にリストが返されると予想されますが、それもそうです。エラーが発生しやすいのは、要素が1つしかない場合は値がスカラーになるか、魔法のように複数の要素があるリストに変わるためです。

したがって、フォーム内の特定のキーに複数の値を渡す必要があることがわかっている場合は、 getall(key)メソッドを使用してそれらを取得できます。あなたの例では：

def submitchange(request):
    for x in request.POST:
        print x, ' = ', request.POST.getall(x)

そしてそれはそれであるはずです！

さらに、Chris McDonoughからのすばらしい記事で、すべてを詳細に説明しています。Peppercorn：フォーム送信データをデコードするためのより簡単な方法-サーバーで2つのリストを取得する代わりに、もう少し実行することにした場合：

name = ["a", "b", "c"]
age = ["10, "20, "30"]

レコードのリストがあります：

[
{'name': 'a',
 'age': 10
},
{'name': 'b',
 'age': 20
},
{'name': 'c',
 'age': 30
},

]
于 2012-07-19T01:25:50.460 に答える
0

これは、2つの入力のクローンを作成していて、それらの名前が繰り返されているためかどうか疑問に思います。クローン作成後にフォームを識別できるようにするためにすべきことはありますか？

はい、そうすべきです。

var i = 1;
$("form").on('keydown',"input[name='age']:last", function() {
    var a = $('.family:last').clone();
    a.insertAfter(".family:last");
    i++;
    $($('.family:last input')[0]).attr('name', 'age'+i);
    $($('.family:last input')[1]).attr('name', 'sibling'+i);

})
    ​
于 2012-07-17T23:17:16.340 に答える