Question

I asked this question in the Ext JS forums, but I received no responses, so I am asking here.

I have a TreePanel (code below) that uses a TreeLoader and an AsyncTreeNode. In my API method specified by the TreeLoader’s dataUrl, I return a JSON array to populate the tree.

This works great, of course. However, I need to return an additional item–an integer–in addition to the array, and I need to display that value somewhere else in my UI. Is this possible? If not, what else would be a good solution?

Here’s the code I have currently:

tree = new Ext.tree.TreePanel({
  enableDD: true,
  rootVisible: false,
  useArrows: true,

  loader: new Ext.tree.TreeLoader({
    dataUrl: '/api/method'
  }),

  root: new Ext.tree.AsyncTreeNode()
});

I want to return one single integer value for the entire response–not per node. Basically my API method will create a database record, and I need to return a value from that database record.

EDIT Thanks to Mike, I have solved this problem. I extended the Ext.tree.TreeLoader class like so:

TreeLoaderWithMetaData = Ext.extend(Ext.tree.TreeLoader, {
  processResponse : function(response, node, callback) {
    var json = response.responseText;

    try {
      var o = eval("("+json+")");
      metaData = o.shift();

      node.beginUpdate();

      for(var i=0, len=o.length; i<len; i++) {
        var n = this.createNode(o[i]);

        if (n) {
          node.appendChild(n);
        }
      }

      node.endUpdate();

      if(typeof callback == "function") {
        callback(this, node);
      }
    }
    catch (e) {
      this.handleFailure(response);
    }
  }
});

And then I can reference variables in the meta data like public members: metaData.my_variable1, metaData.my_variable2. My AJAX data from the server just has an extra array item:

[{"my_variable1":"value1","my_variable2":"value2"},{"id":"node1","text":"Node 1",children:[{"id":"node1nodeA","text":"Node 1 Node A"}]]

Answer 1

You need to override the processResponse function in TreePanel and then you’ll be able to return whatever format JSON you’d like:

From the ExtJS forums:
http://www.extjs.com/forum/showthread.php?32772-Passing-JSON-string-from-Grails-to-populate-TreePanel

The code at the bottom of that thread will help you.