Now, when you simply submit your form the normal way, your browser takes care of sending HTML input arrays inside array with ease and you can begin to segment your data on your server.
This was an interesting complication that I ran into while making a form with dynamic related form fields.
View Code
<form id="submitForm" method="post">
<input type="text" name="amount" value="100">
<table class="table">
<tr>
<th>Name</th>
<th>Mobile</th>
<th>Address</th>
</tr>
<?php
$contact = array
(
array('name'=>'prince','mobile'=>'9625000123','address'=>'abc'),
array('name'=>'alex','mobile'=>'0000123454','address'=>'xyz'),
);
$array = array
(
array('name'=>'prince','mobile'=>'9625000123','address'=>'abc')
);
$i = 0;
foreach ($contact as $value)
{
$j = 0;
?>
<tr>
<td><input type="text" name="contact[<?=$i?>][name]" value="<?=$value['name']?>"></td>
<td><input type="text" name="contact[<?=$i?>][mobile]" value="<?=$value['mobile']?>"></td>
<td><input type="text" name="contact[<?=$i?>][address]" value="<?=$value['address']?>">
<?php
foreach ($array as $ar)
{ ?>
<input type="text" name="contact[<?=$i?>][tank_warehouse][<?=$j?>][mobile]" value="<?=$ar['mobile']?>">
<input type="text" name="contact[<?=$i?>][tank_warehouse][<?=$j?>][name]" value="<?=$ar['name']?>">
<input type="text" name="contact[<?=$i?>][tank_warehouse][<?=$j?>][address]" value="<?=$ar['address']?>">
<?php
$j++;
}
?>
</td>
</tr>
<?php
$i++;
}
?>
</table>
<input type="submit" value="submit">
</form>JavaScript Code
<script>
$(document).ready(function(){
$('#submitForm').submit(function(e){
e.preventDefault();
var formData = new FormData();
var contact = $(this).serializeArray();
$.each(contact, function (key, input) {
formData.append(input.name, input.value);
});
$.ajax({
type:'POST',
url:"<?=base_url();?>Dashboard/getContact",
data: formData,
cache: false,
contentType: false,
processData: false,
dataType: 'JSON',
success:function(data){
}
});
});
});
</script>Ajax call to Controller
public function getContact()
{
print_r($this->input->post());
die;
}Output
Array
(
[amount] => 100
[contact] => Array
(
[0] => Array
(
[name] => prince
[mobile] => 9625000123
[address] => abc
[tank_warehouse] => Array
(
[0] => Array
(
[mobile] => 0000123454
[name] => alex
[address] => xyz
)
)
)
[1] => Array
(
[name] => alex
[mobile] => 0000123454
[address] => xyz
[tank_warehouse] => Array
(
[0] => Array
(
[mobile] => 0000123454
[name] => alex
[address] => xyz
)
)
)
)
)
Complete page source here.
<form id="submitForm" method="post">
<input type="text" name="amount" value="100">
<table class="table">
<tr>
<th>Name</th>
<th>Mobile</th>
<th>Address</th>
</tr>
<?php
$contact = array
(
array('name'=>'prince','mobile'=>'9625000123','address'=>'abc'),
array('name'=>'alex','mobile'=>'0000123454','address'=>'xyz'),
);
$array = array
( array('name'=>'prince','mobile'=>'9625000123','address'=>'abc')
);
$i = 0;
foreach ($contact as $value)
{
$j = 0;
?>
<tr>
<td><input type="text" name="contact[<?=$i?>][name]" value="<?=$value['name']?>"></td>
<td><input type="text" name="contact[<?=$i?>][mobile]" value="<?=$value['mobile']?>"></td>
<td><input type="text" name="contact[<?=$i?>][address]" value="<?=$value['address']?>">
<?php
foreach ($array as $ar)
{ ?>
<input type="text" name="contact[<?=$i?>][tank_warehouse][<?=$j?>][mobile]" value="<?=$ar['mobile']?>">
<input type="text" name="contact[<?=$i?>][tank_warehouse][<?=$j?>][name]" value="<?=$ar['name']?>">
<input type="text" name="contact[<?=$i?>][tank_warehouse][<?=$j?>][address]" value="<?=$ar['address']?>">
<?php
$j++;
}
?>
</td>
</tr>
<?php
$i++;
}
?>
</table>
<input type="submit" value="submit">
</form>
// JavaScript Code
<script>
$(document).ready(function(){
$('#submitForm').submit(function(e){
e.preventDefault();
var formData = new FormData();
var contact = $(this).serializeArray();
$.each(contact, function (key, input) {
formData.append(input.name, input.value);
});
$.ajax({
type:'POST',
url:"<?=base_url();?>Dashboard/getContact",
data: formData,
cache: false,
contentType: false,
processData: false,
dataType: 'JSON',
success:function(data){
}
});
});
});
</script>
// Controller Code
public function getContact()
{
print_r($this->input->post());
die;
}
// Output array
Array
(
[amount] => 100
[contact] => Array
(
[0] => Array
(
[name] => prince
[mobile] => 9625000123
[address] => abc
[tank_warehouse] => Array
(
[0] => Array
(
[mobile] => 0000123454
[name] => alex
[address] => xyz
)
)
)
[1] => Array
(
[name] => alex
[mobile] => 0000123454
[address] => xyz
[tank_warehouse] => Array
(
[0] => Array
(
[mobile] => 0000123454
[name] => alex
[address] => xyz
)
)
)
)
)
