2009-09-06 12 views
6

編集:最初から始めて問題を修正しました。 y'alls時間を無駄にして申し訳ありません。あなたがそんな気がするなら、閉会に投票してください。javascriptを使用してフォーム要素を動的に追加 - 投稿しません

入力フィールドがjavascriptで追加されたときに送信するフォームで実際のデータを取得するのに問題があります。フィールドが表示され、適切な場所にありますが、サーバー側でvar_dump(fieldname)を実行すると、何も表示されません。ライブHTTPヘッダを調べると、ブラウザが動的に追加されたフォームフィールドを送信しようとしていないことがわかります。

フォームに動的に作成されたフォーム入力を何らかの形で「添付」する必要がありますか?

マイコード:

HTML

<form id="att_form" method="post" name="add_attachments" enctype="multipart/form-data" action="#"> 
<-- below input to prove form submits, just not the dyn added elements --> 
<input name="data[one]" type="text" /> 
<div id="add_fields"></div> 
<input type="submit" /> 
</form> 

Javascriptを

function addFormField() 
{ 
var id = 1; 
var htm = "<p id='row" + id + "'><input type='text' size='20' name='txt[]' id='txt" + id + "' /></p>"; 
$("#add_fields".append(htm); 
} 

私がフォームを送信すると、データ[1]という名前の私の入力はPOSTd値として表示されますaddFormField()で追加されたものはそうではありません。彼らは、HTMLで、正しい場所に表示されますが、POSTはしません。送信するために、要素をフォーム要素に子要素として追加する必要がありますか?

私はSubmit form input fields added with javascriptを見てきました。ここでは、フォームの子にデータを追加するというアイデアがありましたが、CSSの再構築が必要になります。だから、私はそれが上記のコードで簡単にできることを期待しています。

ありがとうございます!

編集:入力ミスを修正しましたが、まだ動作しません。私は上記のSOのリンクで議論されているライブラリフリーのJSメソッドを使用することにしました。しかし、助けてくれてありがとう!

+0

例えば、フォームの名前付き-fieldset'-htmlにhtmlを追加すると、それはうまくいきますか? –

+0

わかりませんが、私はこのインスタンスに固執しようとしていません。それはいくつかのかなり醜いhtmlになります。あなたの助けを借りて、すべての素晴らしい提案を試してみてください。閉鎖の問題。 –

答えて

1

..ので、多分フォームはそれらを無視.. inputタグやpタグを閉じなかったコード内の誤字がたくさんありました。たとえば、jqueryのselectorタグを閉じなかったとします。あなたは $("#add_fields".append(htm);

を入れ

$("#add_fields").append(htm);

お知らせ行方不明括弧れている必要があります。

しかし、あなたの問題は主にPHPを通して値にアクセスしようとしていることにあります。私はちょうどあなたのソースをテストページに入れて、値に正しくアクセスすればすべて動作します。

<?php 
foreach ($_REQUEST['txt'] as $printme) 
    echo $printme."<br/>"; 
?> 

上記のソースは正常です。

2

あなたのコード内の2つのタイプミスがあります:代わりにHTML

とadd_fields/add_files

0

の HTMは、あなたの実際のコードということですか?

もしそうなら、あなたは

var htm = "<p id='row" + id + "'><input type='text' size='20' name='txt[]' id='txt" + id + "' /></p>"; 
0

innerHtmlを追加/追加するか、フォームフィールドをhtmlとして配置すると、フォームの外側に配置されますが、フォームの一部として表示されますが、内部的には表示されません。

この問題を解決するには、form=myFormのような入力ファイルにform属性を追加する必要があります。myFormはフォームIDにする必要があります。

関連する問題