I am trying to create a dynamic form with jquery that creates an array that I can retrieve after submitting the form.
I believe where I am going wrong is the array. Unfortunately this is the first time I have tried multidimensional arrays. And I am trying to select values from different layers.
So the fiddle below is what I have been able to get to so far.
As you should be able to see my top array is 'events', these are numbered in the fiddle as 1 and 2. Then if 'cycle' is selected, jquery will add a div. Within the div are inputs 'start point X:' and 'Z:', there is also a 'Add point' button that will add a row of form fields each time it is clicked.
For reference I am using codeigniter, so my controller has
function code(){
$data['global'] = $this->input->post('global');
$data['event'] = $this->input->post('event');
$this->load->view('view', $data);}
So I believe the problem is in my array markup. I can quite happily retrieve the values within the seperate 'global' array in my (codeigniter) view with $global['home_x'] or $global['home_z'].
I can also retrieve $event[$j]['x_start'] and $event[$j]['z_start'] by looping with:
$event_count = count($event);
for ($j = 1; $j <= $event_count; $j++){
if($event[$j]['type'] == "cycle"){
echo number_format($event[$j]['x_start'], 3);
echo number_format($event[$j]['z_start'], 3);
}
However when I come to loop through the 'point' layer of the array it starts to go wrong. So continuing from above I am doing:
if(isset($event[$j]['point'])){
$point_count = count($event[$j]['point']);
for ($i = 1; $i <= $point_count; $i++ ) {
if($event[$j]['point'][$i]['type'] == "move"){
echo "Move" . number_format($event[$j]['point'][$i]['x_end'], 3) . number_format($event[$j]['point'][$i]['z_end'], 3);
}
else if($event[$j]['point'][$i]['type'] == "arc"){
echo "Arc" . number_format($event[$j]['point'][$i]['x_end'], 3) . number_format($event[$j]['point'][$i]['z_end'], 3) . number_format($event[$j]['point'][$i]['radius'], 3);
}
else if($event[$j]['point'][$i]['type'] == "position"){
echo "Position" . number_format($event[$j]['point'][$i]['x_end'], 3) . number_format($event[$j]['point'][$i]['z_end'], 3);
}
}
}
}
I want each event to have an independent point key. As at the moment with my var point = 1 and point++ I am just adding 1 onto the key each time the add point button is pressed, whether it is event 1 or 2.
So I need something like this:
event - 1 - x_start
z_start
point - 1 - type
x_end
z_end
radius
point - 2 - type
x_end
z_end
radius
2 - x_start
z_start
point - 1 - type
x_end
z_end
radius
point - 2 - type
x_end
z_end
radius
Instead of:
event - 1 - x_start
z_start
point - 1 - type
x_end
z_end
radius
point - 2 - type
x_end
z_end
radius
2 - x_start
z_start
point - 3 - type
x_end
z_end
radius
point - 4 - type
x_end
z_end
radius
If there is the possibility that the 'point' key number can reorder itself as well when the 'Delete point' button is pressed that would be perfect. So, for example, when point 1 is deleted point 2 becomes point 1.
Lastly I need the events to be dynamic as well, so when a hypothetical 'add event' button is pressed it adds a new event. And vice versa with a delete button. But I have only looked at the for loop in the view page at the moment.
I hope that I explained this well enough!!!