Tree showing "demo" data

[jean-fredericParticipant]

Hello, I have a weird Issue.

Im seeing a “default” listing instead of the list im expected.

Here is the menu I get (this menu is inside the tree demo page) Home-Solutions-Products-Support , and inside Solution I see : Education-Financial services-Government-Manufacturing… etc.

Im connected to a web Api returning this Xml :

<ArrayOfPagesDto xmlns:i=”http://www.w3.org/2001/XMLSchema-instance” xmlns=”http://schemas.datacontract.org/2004/07/PagesDto”>
<PagesDto>
<Order>1</Order>
<PageName>Home</PageName>
<id>1</id>
<parentid>-1</parentid>
</PagesDto>
<PagesDto>
<Order>1</Order>
<PageName>Menu 1</PageName>
<id>2</id>
<parentid>1</parentid>
</PagesDto>
<PagesDto>
<Order>2</Order>
<PageName>Menu 2</PageName>
<id>3</id>
<parentid>1</parentid>
</PagesDto>
<PagesDto>
<Order>3</Order>
<PageName>Menu 3</PageName>
<id>4</id>
<parentid>1</parentid>
</PagesDto>
<PagesDto>
<Order>2</Order>
<PageName>Menu 1b</PageName>
<id>5</id>
<parentid>2</parentid>
</PagesDto>
<PagesDto>
<Order>1</Order>
<PageName>Menu 1a</PageName>
<id>6</id>
<parentid>2</parentid>
</PagesDto>

…

</ArrayOfPagesDto>

Here is my code :

// prepare the data
var source =
{
datatype: “xml”,
datafields: [
{ name: ‘id’, map: ‘id’ },
{ name: ‘Ordre’, map: ‘Ordre’ },
{ name: ‘PageName’, map: ‘PageName’ },
{ name: ‘parentid’, map: ‘parentid’ },

],
root: “ArrayOfPagesDto”,
record: “PagesDto”,
id: ‘id’,
url: “/api/AllPages”,
};

// create data adapter.
var dataAdapter = new $.jqx.dataAdapter(source);
// perform Data Binding.
dataAdapter.dataBind();

var records = dataAdapter.getRecordsHierarchy(‘id’, ‘parentid’, ‘items’, [{ name: ‘PageName’, map: ‘label’ }]);

$(‘#jqxTree’).jqxTree({ source: records, height: ‘300px’, width: ‘300px’, theme: theme });

But like I said, I only see the “default” menu.
Also, I need to “order” content of each menu with “Order” field. So menu 1a will be “before menu 1b. (this will be used later for drag’n’drop. I will save this state.

Thanks

[Peter StoevKeymaster]

Hi jean-frederic,

I think that when you create jqxTree, records is empty, because you make an Ajax call. Set the source object’s async member to false to synchronize your code.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com/

[jean-fredericParticipant]

Hi Peter,

Wow, thanks for that fast answer ! and yes, this solved the issue !

THANKS A milion time !

Have a great day, you saved mine !

Jean-Frédéric

[jean-fredericParticipant]

is there a way to “sort” ?

Or I can sort it backend to have all “Order” field sorted ? And the dataAdapter to keep it in the same order ?

[Author]

Posts