how to get all treegrid data(json)

[ShindouParticipant]

Hello,

Last week I started learning jqxTreeGrid,

Now I have a question about getting the treegrid’s all data, which will be send to remote server as json.

here is my code:

var jsonData = [
                {
                    "seq":1
                    ,"code":"Root"
                    ,"children":[{
                        "children":[]
                        ,"seq":2
                        ,"code":"Child1"
                        },{
                        "seq":3
                        ,"code":"Child2"
                        ,"children":[{
                            "seq":4
                            ,"code":"Child2-1"
                            ,"children":[]}]
                        }]
                    }
                ];

var source =
    {
        dataType: "json",
        dataFields: [
                     { name: 'seq', type: 'string' },
                     { name: 'code', type: 'string' },
                     { name: 'children', type: 'array' },
                 ],
        hierarchy:
        {
            root: 'children'
        },
        id: 'seq',
        addRow: function (rowID, rowData, position, parentID, commit) {
            commit(true);
            newRowID = rowID;
        },
        localData: jsonData
    };
    var dataAdapter = new $.jqx.dataAdapter(source);

    // create Tree Grid
    $("#treeGrid").jqxTreeGrid(
    {
        width: "auto",
        height: "auto",
        source: dataAdapter,
        columnsResize: true,
        selectionMode: 'multipleRows',
        enableBrowserSelection:true,
        editable: true,
        ready: function()
        {
            $("#treeGrid").jqxTreeGrid('expandAll');
        },
        columns:
        [
          { text: 'code', dataField: 'code', align: 'center', width: 'auto' ,},
          { text: 'seq', dataField: 'seq', align: 'center', width: 'auto'},
        ]
    });

It shows correctly in page.And I have a button for adding a child rows.Code:

function addChildRow(){
	var selectedRows = $('#treeGrid').jqxTreeGrid('getSelection');//is Array
	if(selectedRows.length>0){
		var selectedRow = selectedRows[0];
		var rowKey = selectedRow.uid;
		$("#treeGrid").jqxTreeGrid('expandRow', rowKey);
		$("#treeGrid").jqxTreeGrid('addRow', null, {}, 'first', rowKey);
		$("#treeGrid").jqxTreeGrid('clearSelection');
		$("#treeGrid").jqxTreeGrid('selectRow', newRowID);
		$("#treeGrid").jqxTreeGrid('beginRowEdit', newRowID);
	}
	
}

The code refers to this

It can add child rows successfully.

I add a child row “Child2-1-1” under “Child2-1”,and add a child row “Child2-1-1-1” under “Child2-1-1” again.

Then I try to get the changed data:

var datasAfterChange = $("#treeGrid").jqxTreeGrid("source").loadedData

its structures makes me confused at added rows.

For example.

var parentRow = $("#treeGrid").jqxTreeGrid('getRow', "Child2-1's rowKey");

var rowFirstlyAdd = $("#treeGrid").jqxTreeGrid('getRow', "Child2-1-1's rowKey");

the variable ‘parentRow’ has a property ‘children’,which is exactly what I want.

but the variable ‘rowFirstlyAdd’ just has property ‘records’ instead of ‘children’,though ‘records’ is as same as ‘children’

What I expected about datasAfterChange is :

[
    {
    "seq":1
    ,"code":"Root"
    ,"children":[{
        "seq":2
        ,"code":"Child1"
        ,"children":[]
        },{
        "seq":3
        ,"code":"Child2"
        ,"children":[{
            "seq":4
            ,"code":"Child2-1"
            ,"children":[{
                "seq":5
                ,"code":"Child2-1-1"
                ,"children":[{
                    "seq":6
                    ,"code":"Child2-1-1-1"
                    ,"children":[]
                    }]
                }]
            }]
        }]
    }
]

Is there convenient way to get above data?

Thanks in advance

[ShindouParticipant]

I have a idea:

var records = $("#treeGrid").jqxTreeGrid("getRows");

var dataFileds = new Array();

and put all treeGrid’s dataFields into dataFileds except “children”,and put “records” into dataFileds

then use JSON.stringify(records,dataFileds) to get the json I want

[HristoParticipant]

Hello Shindou,

This is suitable way to achieve it.
I assume that everything is fine.

Best Regards,
Hristo Hristov

jQWidgets team
http://www.jqwidgets.com

[ShindouParticipant]

Thank you.It works.

[Author]

Posts