動態添加輸入不包括在形式

Question

當用戶點擊帶班「添加輸入」，我會克隆與hidden_​​template ID隱藏輸入按鈕我有類似的東西，以

<form action="/insert" method="POST" class="form-horizontal" role="form"> <input type="text" class="form-control" name = "input_data"/> <input type="text" class="hidden form-control" id = "hidden_template" name ="input_data"/> <button type="button" class="add input">Add Input</button> </form>

，並然後刪除隱藏在新元素上的類並將其附加到HTML。我在jQuery中執行此操作，效果很好。

但是，當我在新元素中輸入文本，然後提交表單時，它不包含在POST中。

有什麼我需要做的，以確保表單將包括新提交的輸入提交？

Answer 1

您的克隆元素與原始元素具有相同的名稱，因此它的值將替換POST中的原始元素。

您輸入更改爲：

<input type="text" class="hidden form-control" name ="input_data[]"/>

注意input_data[]這將創建在服務器端的陣列，在其適當的指數每個值。

此外，ID必須是唯一的，所以您不想在您要克隆的元素上擁有一個ID，否則所有克隆將具有相同的ID，這將是無效的。

Answer 2

你可以明確的通過添加form屬性inputform和input標籤之間的鏈接：

<input ... form="form-id">