Howto bind jxqTree to observable collection with DataAdapter ?

[isv485Member]

Hi!

1. Here is the code that was used to initialize jqxTree with DataAdapter

 var groupsSource = {
                localdata: viewModel.activityGroups,
                datatype: 'observablearray',
                datafields: [
                            { name: 'ActivityGroupId' },
                            { name: 'Title' },
                            { name: 'ParentId' },
                            { name: 'Groups' }
                ]
            }
            var dataAdapter = new $.jqx.dataAdapter(groupsSource);
            dataAdapter.dataBind();
            var records = dataAdapter.getRecordsHierarchy('ActivityGroupId', 'ParentId', 'items', [{ name: 'Title', map: 'label' }]);
            $('#activitiesTree').jqxTree({ source: records, theme: getTheme(), width: '925px' });
            ko.applyBindings(viewModel);

Tree itself defined as:

<div id='activitiesTree'>

Tree loaded and reflects objects hierarchy correctly, but adding new items into observable collection viewModel.activityGroups does not trigger TreeView updates.

I checked jqx demo projects, but failed to find an answer on how to do Tree binding with DataAdapter correctly.
Can you please, provide some hints on this question?

2. What is exact purpose of the getRecordsHierarchy 3rd parameter? Looks like only “items” value works correctly.
For example, if instead of “items” I would try to use “Groups” (which keeps collection of object sub-items), only first level items will be rendered and during tree initialization object Groups items will be replaced with some new items breaking original bindings.
Trying to set “Groups” mapping to “items” did not help much eather.

I am using jqxWidgets 2.6.0

Thanks!

[Peter StoevKeymaster]

Hi isv485,

The getRecordsHierarchy returns an Array of JSON objects. It does not return an observableArray. The expected Array structure which can be used for populating the jqxTree is demonstrated in this sample: events.htm.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[isv485Member]

Thanks, Peter!

Names of my source items properties are “Title” and “Groups” instead of “label” and “items” which are required for the jqxTree.

How can I populate jqxTree without jqxAdapter if my items properties do not match?

Thanks!

[Peter StoevKeymaster]

Hi isv485,

Without jqxDataAdapter, you can’t. jqxTree items should have a ‘label’ field and the sub items array is expected to be called ‘items’. That is the reason why the jqxDataAdapter’s getRecordsHierarchy method has a fields mapping parameter.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[isv485Member]

Thanks, Peter!

Where may I find requirements and jqxTree items supported fields?

I see that currently supported are following item fields:
“label”, “items”, “icon”, “iconsize”. Does jqxTree supports something else?

Regards

[Peter StoevKeymaster]

Hi isv485,

Tree Items have additional fields. You can take a look at the Tree’s API. The supported fields are documented.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[Author]

Posts