jQueryのフォームからフォームへのコピー

あるフィールドから別のフィールドにすべてのフィールドをコピーする必要がありました。フィールドごとにコピーするのではなく、jQueryを使用してルーチンform2formを作成しました。jQueryのフォームからフォームへのコピー

function form2form(aF1, aF2) { 
var selection = "#" + aF1 + " .copy"; 
$(selection).each(function() { 
    document.forms[aF2].elements[$(this).attr('name')].value = $(this).val(); 
    });   
}

ルーチンが動作します。このルーチンでは、入力フォームフィールドにコピークラスがなければなりません。それ以外の場合、フォーム内のすべてのフィールドを取得する方法はわかりません。（ "#form：input"）は、ラジオボタンをスキップし、フィールドを選択します。

私の質問はそうです。

内蔵機能があるので、私はこれを必要としませんでしたか？選択肢を書く良い方法はありますか？クラスを必要としないようにルーチンを変更するにはどうすればよいですか？フォーム名ではなくフォームオブジェクトをテキストとして渡すことはできますか？一般的に良い方法がありますか？

これで働く全ページ：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>test form2form in jQuery</title> 
<script type="text/javascript" src="../scripts/jquery.js"></script></head> 
<script type="text/javascript"> 
function form2form(aF1, aF2) { 
var selection = "#" + aF1 + " .copy"; 
$(selection).each(function() { 
    document.forms[aF2].elements[$(this).attr('name')].value = $(this).val(); 
    });   
} 
function testform2form() { 
form2form ('form1', 'form2'); 
} 
</script> 
</head> 
<body> 
<h3>Copy form to form</h3> 
<form id="form1" name="form1"> 
form1: f1 <input type="text" name="f1" id="f1" class="copy" value="from A"/> 
f2 <input type="text" name="f2" id="f2" class="copy" value="from B" /> 
<select name="fruit" id="fruit" class="copy" > 
    <option value="valApple" selected="selected">Apple</option> 
    <option value="valOrange">Orange</option> 
</select> 
</form> 
<form id="form2" name="form2"> 
form1: f1 <input type="text" name="f1" id="f1" class="copy" value="target A" /> 
f2 <input type="text" name="f2" id="f2" class="copy" value="target B" /> 
<select name="fruit" id="fruit" class="copy" > 
    <option value="valApple">Apple</option> 
    <option value="valOrange" selected="selected">Orange</option> 
</select> 
</form> 
<p><a href="#" onclick="testform2form()">Copy Form to Form (form2form)</a></p> 
</body> 
</html>

出典

2009-09-16 sdfor

機能に建てられたので、私はこれ>を必要としなかったがありますか？

clone()がありますが、それは要素をDOMの別の場所にコピーするためのものです。 2番目のフォームに入力する必要があります。

>フォーム名ではなくフォームオブジェクトをテキストとして渡すことはできますか？

はい：

function form2form(formA, formB) { 
    $(':input[name]', formA).each(function() { 
     $('[name=' + $(this).attr('name') +']', formB).val($(this).val()) 
    }) 
}

あなたもそれのプラグインすることができます！

(function($) { 
    $.fn.copyNamedTo = function(other) { 
     return this.each(function() { 
      $(':input[name]', this).each(function() { 
       $('[name=' + $(this).attr('name') +']', other).val($(this).val()) 
      }) 
     }) 
    } 
}(jQuery))

PS ":input"擬似セレクタは、無線又は選択入力をスキップしません。明示的にはselectとinput要素（少なくとも1.3.2）が含まれ、そのうちradioボタンの一部です。

出典

2009-09-17 01:57:58

この機能は機能しますが、2番目のフォームにはすでに同じ入力がある場合にのみ注意してください。私は誤って読んで、これを使って最初のフォームの入力がなかった2番目のフォームにデータを入力しようとしました。 – DMulligan

チェックボックスとラジオボタンは処理されません –

これをプラグインに追加して、チェックボックスを動作させる必要がありました。

$('[name=' + $(this).attr('name') +']', other).attr("checked", $(this).attr("checked"));

出典

2011-11-09 18:21:57 Flobi

jQueryのフォームからフォームへのコピー

答えて

関連する問題