How to display data in ExtJS tree received using jsonArray from struts2 action

Question

Hello everyone, I am new to ExtJs and I am just having a hard time reading the json array received from struts2 application.

Following is the json array that I received from struts application

[{"children":[{"children":[],"cls":"file","id":11,"leaf":true,"text":"A Child 1"},{"children":[],"cls":"file","id":12,"leaf":true,"text":"A Child 2"}],"cls":"folder","id":10,"leaf":false,"text":"A Folder"}]

it works fine if I save it in the .json file and call it using dataUrl: 'json.json'. But when I call it using dataUrl: 'myAction.action', the data is not loaded.

I would really appreciate if someone could throw some insight on something I am missing here. Following is my .js, which is similar to example provided by extjs

Ext.onReady(function(){
    // shorthand
    var Tree = Ext.tree;

    var tree = new Tree.TreePanel({
        useArrows: true,
        autoScroll: true,
        animate: true,
        enableDD: true,
        containerScroll: true,
        border: false,
        // auto create TreeLoader
        dataUrl: 'myAction.action',

        root: {
            nodeType: 'async',
            text: 'Ext JS',
            draggable: false,
            id: 'src'
        }
    });

    // render the tree
    tree.render('tree-div');
    tree.getRootNode().expand();
});

Answer 1

Make sure your dataUrl is valid at runtime. Use FireBug or the Safari console to see the XHR request for myAction.action - my guess is that you might need to change it to /something/myAction.action.