I have a questions regarding model / page structure for what I am sure is a somewhat common pattern. But I am unable to find an answer for my specific needs.
I have a page that has an autocomplete to "search" for a person. Once that person is selected from the autocomplete, a form is displayed to show the detailed data about that person to be viewed / modified. Most of the data is displayed using simple html inputs and a few datepickers. However there is part of the data structure that displays multiple entries (think locations the person is associated with). This structure is best represented in a grid in my case.
Thus I am wondering if a single view model for the entire page makes most sense? So most of the fields on the page would be bound to say a "person" view model. And within that view model there would be a property that held the data returned from the second service call (after the initial autocomplete selection). So a "person" viewmodel would have a property called "data" and within that data property would be the data for the grid as well "data.locations". However when the grid is modified I am thinking that instead of syncing the entire view model only the grid data would need to be synced. So does that mean two viewmodels?
What is the general consensus for how to best structure this?