使用javascript動態添加表單元素 - 不提交

編輯：我從頭開始解決了這個問題。對不起，浪費你們大家的時間。如果您覺得如此傾向，請投票結束。使用javascript動態添加表單元素 - 不提交

我無法獲得表單中的實際數據以便在通過javascript添加輸入字段時提交。這些字段顯示在正確的位置，但是當我在服務器端執行var_dump（fieldname）時，沒有任何內容顯示出來。使用Live 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); 
}

當我提交表單，我輸入一個名爲數據[一]顯示爲一個POSTd值，但用addFormField（）添加的那些不會。他們在HTML中顯示在正確的位置，但不要POST。我是否需要將該元素作爲子元素附加到我的表單元素以使其提交？

我見過Submit form input fields added with javascript這是我將數據專門添加到表單子的想法，但這需要對CSS進行一些重構。所以，我希望在上面的代碼中我可以做到這一點。

在此先感謝！

編輯：修正了錯別字，但仍然無法正常工作。我決定使用上面的SO鏈接中討論的庫免費JS方法，因爲這很好。感謝您的幫助！

來源

2009-09-06 Travis Leleu

如果您將html附加到例如名爲''fieldset'-child的子窗體？ – 2009-09-06 17:58:55

不確定，但我試圖不卡住這個實例。它會進入一些非常醜陋的HTML。跑出規定的時間來嘗試所有偉大的建議，但謝謝大家的幫助！關閉問題。 – 2009-09-06 18:34:23

有代碼中的錯別字很多。例如，你沒有關閉jQuery的選擇器標籤。

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

本來應該 $("#add_fields").append(htm);

通知書丟失的括號。

但我相信你的問題主要在於你如何試圖通過PHP訪問值。我只是把你的源碼放在一個測試頁面中，如果你正確地訪問了這些值，這一切都會有效。

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

上述來源正常工作。

來源

2009-09-06 20:45:14 MagikWorx

有2個錯別字代碼： HTM而不是HTML

和add_fields，傳入三個/ add_files

來源

2009-09-06 17:59:33 Olivvv

那是你的實際代碼？

如果是這樣，你不關閉輸入標籤和p標籤..所以也許形式忽略他們..

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

來源

2009-09-06 18:00:02 amitkaz

當您添加/追加或使用innerHtml將表單字段放置爲html時，有時它會將它放在表單之外，您將看到它是表單的一部分，但內部不是。

要解決此問題，您需要添加form屬性，並輸入如form=myForm，myForm應該是您的表單ID。

來源

2012-07-19 11:29:03

使用javascript動態添加表單元素 - 不提交

回答

相關問題