I have a backend data model that looks like this:
- a person has a name and one or more pets
- a pet has a name and zero or more tags
Now, I am building an html admin interface to input people into the database. I envision a page that has a form with a bunch of input fields that correspond to the person info or the pet info for that person, and then there is a button to click to add a new pet (which dynamically adds new input fields for a pet). A similar button to dynamically add tags to a pet also exists for each pet. Upon filling out a person and all of their pets, you submit the form and the backend uses the post data to create a new person and pets.
This is giving me a lot of trouble, and I think it is because there is this hierarchical one to many relationship between person and pets. Using html id's like "pets[]" allows me to get back an array in the backend on the post, but a pet itself has a zero to many relationship with tags..so then I need like "pet_id_tags[]" or something. But this is a pain in the ass, very dirty, hard to process, and not easy to add more things later.
I started to think that maybe I should just send json data back and forth to the server and have javascript keep an object in memory that contains all the data. Then addings pets and tags to pets just modifies the in memory object. When I want to save this stuff, I just send the object back to the server as json and not worrying ever about lots of clunky html post parameters.
Is this how people typically solve this problem? How would you do it?