2012-01-03 12 views
3

私はユーザーが入っているシンプルなWebアプリケーションを作成しています。ドロップダウンボックスから選択し、テキストを入力します。これが完了すると、ユーザーは「生成」ボタンを押します。このボタンは結果として連結された文字列(<span>に表示)を表示し、ユーザーはそれをコピーして貼り付けることができます。私は1行で問題なく動作するようにしました。JQueryでクローンを作成し、それぞれに固有のIDを追加する

しかし、今私が達成しようとしているのは、ユーザーがクリックして上の行を複製する「行を追加」ボタンを持つことです。私が問題を抱えているのは、行が複製され、生成ボタンがクリックされると、コピーされた<span>は、前の<span>と同じ値を入力するだけです。

更新:私はその行をコピーして下に置くために、JQueryのclone()関数を使用することに成功しました。フォームのIDを含む、コピーされた各要素のIDを変更することは可能ですか?つまりは、それがコピーされるとき、フォームは、「Form1の」、と言うと呼ばれるためにコピーされるということを私が持っているものの

JSフィドルはここにある:

http://jsfiddle.net/XJEAn/

UPDATE 2:基本的に私が何かを必要としますthisに似ていますが、私が試したコードです!

答えて

6

私はそれはおそらく、まさに完璧ではないのですが、あなたは正しい方向に行くを取得する必要があります新しい形のユニークなIDの

http://jsfiddle.net/zq3AN/

を与えるためにあなたのフィドルを更新しました。

var uniqueId = 1; 
$(function() { 
    $('.addRow').click(function() { 
     var copy = $("#original").clone(true); 
     var formId = 'NewForm' + uniqueId; 
     copy.attr('id', formId); 


     $('#campaign').append(copy); 
     $('#' + formId).find('input,select').each(function(){ 
      $(this).attr('id', $(this).attr('id') + uniqueId); 

     }); 
     uniqueId++; 
    }); 
}); 

基本的にフォームをコピーし、IDを変更してdivに追加します。すべての入力を調べ、同じuniqueIdパラメータを選択してIDに追加します。

+0

ありがとう!私は今見てみましょう... – zik

+0

ちょうどこれを適切に見た。ありがとう@パトリシア、これは動作し、機能はそこにあります。一日中修正しようとしていた問題を解決しました - ありがとう! :) – zik

+0

うれしい私は助けることができる:) – Patricia

0

jQuery clone() functionを使用して、「行を追加」機能を実装することができます。

新しい行ごとに一意のIDを与える最後の例を確認してください。

関連する問題