Nested Data Objects

Imagine you were working with a given web-service that provides and expects data with a certain nested data structure for example like this:

{
	account: {
		username: 'beatles',
		password: 'submarine',
		users: [{
			firstname:'John',
			lastname:'Lennon'
		},
		{
			firstname:'Paul',
			lastname:'McCartney'
		}]
	}
}

I don’t like it too much but this is what you sometimes get in real life. One way you could handle this is to convert your flat data that you get from your form (i. e. by using uicForm3‘s data()-method) to the needed data structure and vica versa so that you are able to exchange data directly. Because this is annoying work to do uicForm3 can handle these kind of data natively. The only thing you have to do is to name your form fields according to the object structure and following some syntax rules. These rules are adapted from the way php handles this task and are therefore very common rules and nothing special.
As you might know if you have a list of checkboxes say with the name “bands” and some of these checkboxes are checked you send to the server something like that:

bands=beatles&bands=rolling%20stones&bands=wings

.This is the url encoded representation of your three form elements with the same name “bands” – and this also is the problem. It’s obvious that we can not simply make key-value-pairs out of it because than we would have three keys with the same name what simply is not possible. Php solves this problem by taking in account only the first key-value-pair and dismissing the others and therefore storing an incorrect value as long as you don’t rename the property. Fortunately php allows you to give it a hint that you are expecting a complex value combined from multiple key-value-pairs with the same name. Just put brackets behind the property (“bands[]”) and php will consider all key-value-pairs with that name as one property with the name “band” and assign an array with all three values to it.
A little less known might be the fact that php uses the same concept to handle complex and nested data structures:
So we are able to convert every property of our sample object to form field names. I think the best way to dedcribe how this works is to do it for the sample data. The following table contains on the left side the property or the property path of a final value and the right side of the table contains the converted fieldname.

property path form element name
account.username account[username]
account.password account[password]
account.users[0].firstname account[users][0][firstname]
account.users[0].lastname account[users][0][lastname]
account.users[1].firstname account[users][1][firstname]
account.users[1].lastname account[users][1][lastname]

So if you want to send nested data to php just name your form fields according to this example and then on the backend you only need to request the query or post variable with the name “account” and that holds your nested object structure with all properties and values just like our example on top of this article (certainly as php object not as javascript object). If you don’t believe check it out for yourself.
uicForm3 does pretty much the same with the convenience that you don’t need a server solution and that you don’t need empty brackets if you are expecting an array because of multiple form fields with the same name.
Naming your form fields like this allows you to send nested data structures directly to uicForm3 and retrieve nested object structures from the form.
So at least you define the input and output structure of your form with the form fields names.


Set the data (it’s the same data as in the example above) and then get the data back rom the form. The result shows the same nested data structure as the input has been.