html表單輸入 - 每個輸入字段的多個答案

Question

我不確定如何說出這個問題，但我會盡我所能。 我有一個從用戶那裏收集關於就業歷史數據的表單。此刻我的形式如下：

<form name="EmploymentHistory" action="Form E.php" method="post"> 

    <h2>Employment History</h2> 
     <label>Last/Current employer</label> 
     <input type='text' name='LastCurrentemployer'> 
<hr> <label>Position</label> 
     <input type='text' name='Position'> 
<hr> <label>Date Started</label> 
     <input type='text' name='DateStarted'> 
<hr> <label>Date Finished</label> 
     <input type='text' name ='DateFinished'> 
<hr> <label>Supervised by</label> 
     <input type='text' name = 'Supervisedby'> 
<hr> <label>Contact Details for Boss</label> 
     <input type='text' name='ContactDetailsForBoss'> 

<hr> <button type='button'>Add another job</button> <br> 
<hr> <input type="submit" value="Next"> 
    </form> 

我的問題是，「添加另一個職位」按鈕，什麼也不做。
如何讓用戶在他們的工作經歷中輸入多個工作，以便每個工作都作爲新記錄輸入到我的數據庫中，但是提交按鈕（下一個）只需要點擊一次？

我在想試圖然後使用arraypush添加的每個條目，比如設置一個數組：

$pastemployers = array(); 
arraypush $pastemployers(POST_['LastCurrentemployer']); 

然後循環到每一個添加爲一個新的記錄，如：

for ($x = 0; $x < count(pastemployers); $x++){ 
echo "<input name='pastemployers" . $x . "' value='" . $pastemployers[$x] . "'> </input>"; 

我相信有更好的方法來做到這一點，但我無法在網上找到答案或解決。我的大部分搜索都會返回關於複選框或多個提交按鈕的結果（對我沒有幫助）。請幫助

Answer 1

首先改變你的表格，並使用addAnotherJob（）來創建第一個span（使用jQuery）的克隆並改變每個表單字段的id。在提交這個表單的時候，你會得到一系列僱主信息。

<form name="EmploymentHistory" action="Form.php" method="post"> 

    <h2>Employment History</h2> 
    <span class="span_clone"> 
     <label>Last/Current employer</label> 
     <input type='text' id='LastCurrentemployer_0' name='LastCurrentemployer[]'> 
<hr> <label>Position</label> 
     <input type='text' id='Position_0' name='Position[]'> 
<hr> <label>Date Started</label> 
     <input type='text' id="DateStarted_0" name='DateStarted[]'> 
<hr> <label>Date Finished</label> 
     <input type='text' id='DateFinished_0' name ='DateFinished[]'> 
<hr> <label>Supervised by</label> 
     <input type='text' id='Supervisedby_0' name = 'Supervisedby[]'> 
<hr> <label>Contact Details for Boss</label> 
     <input type='text' id='ContactDetailsForBoss_0' name='ContactDetailsForBoss[]'> 


<hr> <button id='add-another-job-0' type='button' onclick= 'addAnotherJob()'>Add another job</button> <br> 
</span> 
<hr> <input type="submit" value="Next"> 
    </form> 

請參考以下鏈接：http://jsfiddle.net/ambiguous/LAECx/