Announcement

Collapse
No announcement yet.
X
  • Filter
  • Time
Clear All
new posts

  • [HOWTO] Show a TreeGrid in a drop-down (SelectItem)

    I've had this on my list for a while - we have been using TreeMenuItem to get a drop-down button that shows a tree structure. However, the number of items in the tree is quite large (in depth) and the number of pop-up canvases that get created when navigating are sub-optimal.

    Instead, we wanted to create something like the Dropdown Grid sample but showing a TreeGrid instead of a ListGrid.

    It turned out to be quite easy to do (for a Proof-of-Concept anyway), but required a bit of copy & pasting that could be avoided if the concept were to be incorporated into the framework.

    Here is what the result of the work looks like:


    In order to achieve this I had to:
    1. Make a copy of 'ScrollingMenu' from ISC_Forms and rename all occurrences of ScrollingMenu within the copy to ScrollingTreeMenu and change the base class of the copy to 'TreeGrid'. I made a copy of all the styles so if another developer does this please take care of case-sensitivity issues when doing a Find+Replace.
    2. Make a copy of 'PickListMenu' also from ISC_Forms and rename all occurrences of PickListMenu within it it to PickListTreeMenu and change the base class to ScrollingTreeMenu
    3. Specify pickListConstructor in the DynamicForm SelectItem where you want to use it (see below for example)
    Code:
    fields: [
                {
                    name:"itemID",
                    title: "field",
                    editorType:"select",
                    width:240,
                    title:"Item",
                    optionDataSource:"DynTreeDS",
                    valueField:"id",
                    displayField:"fieldId",
                    pickListConstructor: "PickListTreeMenu",
                    pickListWidth:450,
                    pickListFields: [
                        { name: "id" }
                        ,{ name: "fieldId" }
                    ]
                }
            ]
    Hope this helps anyone else trying to achieve the same!

  • #2
    We'll add a setting that allows you to easily show a list or tree by configuring the data-set type. No specific ETA, but we'll update here when it's done.

    Comment


    • #3
      Wow, this is great news!
      Happy to hear that , thanks:-)

      Comment


      • #4
        Cool! Yes, when its available we shall switch to the framework provided method.

        Comment

        Working...
        X