如何將整組文本輸入作爲json對象內的數組發送？

Question

我的表單中有一個部分，用戶可以「點擊添加更多」。

例如，假設您可以將好友添加到您的註冊：

<a href="#">Click to add friend</a> 

<label>First Name</label> 
<input type="text" name="friend[firstName]"> 

<label>Last Name</label> 
<input type="text" name="friend[lastName]"> 
... 

，只要你想你可以有許多朋友。

當我提交表單時，我捕獲表中的主要記錄。我們將其稱爲tableA。一旦設置，我返回插入ID，然後插入所有朋友到tableB與一個外鍵指向主要記錄。

到目前爲止這麼好。

我想要做的是捕獲每個朋友作爲一個數組並保存爲json對象。我關閉，但不是那裏。

以上輸出這樣的：

... 
[friend_data] => {"friend":{"firstName":"Tyler","lastName":"Durden"}} 

比方說，我已經加入的三個朋友。只有最後的朋友纔會被記錄下來（這是有道理的）。

所以，我想改變我的投入是這樣的：

HTML

<label>First Name</label> 
<input type="text" name="friend[][firstName]"> 

<label>Last Name</label> 
<input type="text" name="friend[][lastName]"> 
... 

它得到我：

[friend_data] => {"friend":[{"firstName":"Tyler"},{"lastName":"Durden"},{"firstName:"Joe"},{"lastName":"Smith"}]} 

我（覺得）我試圖做到的是這個：

[friend_data] => {"friend":[{"firstName":"Tyler"},{"lastName":"Durden"}],[{"firstName:"Joe"},{"lastName":"Smith"}]} 

我用這創建上述：

PHP

json_encode(array('friend' => $input['friend'])) 

這樣我可以遍歷JSON對象和渲染每個陣列是這樣的：

HTML

<ul> 
    <li>First Name: Tyler</li> 
    <li>Last Name: Durden</li> 
</ul> 
<ul> 
    <li>First Name: Joe</li> 
    <li>Last Name: Smith</li> 
</ul> 

謝謝任何建議！

編輯

謝謝您的建議馬爾科艾爾卡！

我已經更新了我類似這樣的標記：

HTML

... 
<input type="text" name="friend[1][firstName]"> 
<input type="text" name="friend[1][lastName]"> 

我輸入動態地通過JavaScript創建。我在添加新朋友時，標記如下所示：

... 
<input type="text" name="friend[2][firstName]"> 
<input type="text" name="friend[2][lastName]"> 

...等等。

生成此：

... 
[friend_data] => {"friend":{"1":{"firstName":"Tyler","lastName":"Durden"},"2":{"firstName":"Joe","lastName":"Smith","address":"3014 SW Prairieview Rd","city":"Ankeny","zip":"","acresAllotted":""}}} 

我仍然不認爲這是完全正確的。 它與我如何編碼數據有什麼關係？

$person->friend_data = json_encode(array('friend' => $input['friend'])); 

SOLUTION

感謝馬爾科艾爾卡的幫助！以下是我在其他人遇到此線索時所做的事情。

如上所述，我有一部分可以在我的表單中添加朋友到我的註冊。默認情況下，只有一個朋友在頁面加載時可見。使用JavaScript（jQuery）我允許用戶添加儘可能多的朋友，因爲他們想要的。

這是頁面初始加載時的標記（爲了簡單起見縮短）。

HTML

<p><a href="#" id="add">Add Friend</a> 
<form> 
<div class="clone"> 
<label>First Name</label> 
<input type="text" name="friends[1][firstName]"> 

<label>Last Name</label> 
<input type="text" name="friends[1][lastName]"> 
</div> 

<button type="submit">Submit</submit> 
</form> 

jQuery的

var friendCount = 1; 

$('#add').click(function (event) { 
    // do stuff. 
    // update the index 
    jquery.find(':input').each(function() { 
     $(this).attr('name', 'friend[' + friendCount + '][' + $(this).data('name') + ']'); 
      }); 
}); 

然後在PHP端我抓住所有的值：

PHP

$friends = array(); 
foreach ($input['friend'] as $friend) { 
    array_push($friends, $friend); 
} 
... 
$person->friend_data = json_encode($friends); 

會產生這樣的JSON：

JSON

[friend_data] => [{"firstName":"Tyler","lastName":"Durden"},{"firstName":"Master","lastName":"Shake"}] 

Answer 1

在ID填寫時，可以進行有益的陣列：

Friend 1: 
<label>First Name</label> 
<input type="text" name="friend[0][firstName]"> 
<label>Last Name</label> 
<input type="text" name="friend[0][lastName]"> 

Friend 2: 
<label>First Name</label> 
<input type="text" name="friend[1][firstName]"> 
<label>Last Name</label> 
<input type="text" name="friend[1][lastName]">