PDA

View Full Version : Populating DataView or ListView - what's best approach?



gkaplan
20 Sep 2010, 6:59 PM
I would like to populate the contents of a DataView as a response to a click within another pane, however I'm not sure there is a need for a Store object. I would appreciate any thoughts on how to best solve my requirements. My way seems too "brute force" so I suspect there is a more elegant way to approach the problem.

A border panel contains a TreePanel in the west and a
[ListView or DataView or Panel] in the center. When the tree is first instantiated, it obtains its nodes from the server as JSON. The leaves of the tree contain some custom attributes, one being an array of Javascript objects. For this app, the leaf represents a "diagnosis group" and the array of Javascript objects are the individual diagnosis objects. For simplicity, each diagnosis object contains a long string description, and an array of Strings that represent any "notes" about this diagnosis. The diagnosis object is NOT displayed in the tree, so the tree goes only as far as the diagnosis group.

When the user selects a diagnosis group, the selected group is passed to the onClick function. This function now has the entire diagnosisGroup object, complete with all its diagnoses. These diagnoses need to be displayed in the center pane, nicely formatted, and selectable (with an onClick). Each diagnosis may have several notes which also must be formatted nicely and displayed with the main diagnosis description and kept as a SINGLE selectable object in the DataView|ListView|Panel.

The underlying flow is:
1) User expands the tree to find a diagnosis group and selects it.
2) User then sees all the diagnoses in the center pain. Each diagnosis may have some special notes included with it.
3) User can select one diagnosis.
4) User clicks the "Next" button in the card panel. Underlying code can determine what diagnosis the user selected and pass to the next step.

The question I have has to do with how to populate a DataView. I can easily create a Template object that will consume the DiagnosisObject and produce a single chunk of HTML that can be rendered in the DataView, but the confusion comes with the embedded arrays and whether the Store can handle them. From every example I've found, the Store can only handle single records, but there is no mention of a record which contains child objects. In my case, the record represents a diagnosis, and the child objects are all the notes for that diagnosis.

So, the JSON data that populated the tree is in the form of:

Level1 node
--Level2 node
----DiagnosisGroup (shown as a leaf in tree)
------Diagnosis
--------Note_1
--------Note_n
------Diagnosis
------Diagnosis
--------Note_1

WHen the DiagnosisGroup is clicked, the DataView would display 3 selectable items (Each diagnosis), but the formatting in the DataView would include the notes.

OK, how should this be done? All the data is already held in the tree, so there is no need to go back to the server. I could potentially flush a Store and reload it on each leaf selection, but can the store handle nested data? Or should I use a ListView, and can a ListView display template-formatted data?

Any help is greatly appreciated. I'm not sure how to proceed. Thanks in advance!

evant
20 Sep 2010, 7:15 PM
If you're looking for help, please post in the help forum. Moving.