Loading ...
Sorry, an error occurred while loading the content.

Dynamic tree with XHR data

Expand Messages
  • info2hussain
    Hi All, I want to create a dynamic tree with XHR data. I followed the YUI s example about that and wrote my own code but I see nothing in the browser. I don t
    Message 1 of 1 , Aug 1, 2008
    • 0 Attachment
      Hi All,

      I want to create a dynamic tree with XHR data. I followed the YUI's example about that and wrote my own code but I see nothing in the browser. I don't even get any error message. My codes are:

      <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www. w3.org/TR/ html4/strict. dtd">
      <html>
          <head>
              <meta http-equiv=" Content-Type" content="text/ html; charset=iso- 8859-1" />
              <title>Untitled Document</title>
              <!-- css -->
              <link rel="stylesheet" type="text/css" href="http:/ /yui.yahooapis. com/2.5.2/ build/treeview/ assets/skins/ sam/treeview. css">
             
              <script type="text/javascri pt" src="http:// yui.yahooapis. com/2.5.1/ build/yahoo/ yahoo-min. js"></script>
              <script type="text/javascri pt" src="http:// yui.yahooapis. com/2.5.2/ build/event/ event-min. js"></script>
              <script type="text/javascri pt" src="http:// yui.yahooapis. com/2.5.2/ build/connection /connection- min.js"></script>
              <script type="text/javascri pt" src="http:// yui.yahooapis. com/2.5.1/ build/json/ json-min. js"></script>
              <script src = "http://yui. yahooapis. com/2.5.2/ build/treeview/ treeview- min.js" ></script>
              <script type="text/javascri pt">
                 
                  function buildTree(){
                     
                      //create a new tree:
                      tree = new YAHOO.widget. TreeView( "tree");
                     
                      //turn dynamic loading on for entire tree:
                      tree.setDynamicLoad (loadNodeData, currentIconMode) ;
                     
                      //get root node for tree:
                      var root = tree.getRoot( );
                     
                      //add child nodes for tree;
                      var aStates = ["Process", "Activity", "Process Instance", "Activity Instance"];
                      for (var i = 0, j = aStates.length; i < j; i++) {
                          var tempNode = new YAHOO.widget. TextNode( aStates[i] , root, false);
                      }
                     
                     
                      tree.draw();
                     
                  }   
                      function loadNodeData( node, fnLoadComplete) {
                     
                     
                          var callbacks = {
                              // Successful XHR response handler
                              success: function(o){
                                  var messages = [];
                                 
                                  // Use the JSON Utility to parse the data returned from the server
                                  try {
                                      messages = YAHOO.lang.JSON. parse(o.response Text);
                                  }
                                  catch (x) {
                                      alert("JSON Parse failed!");
                                      return;
                                  }
                                 
                                  var len = messages.length;
                                  for (var i = 0; i < len; ++i) {
                                 
                                      var m = messages[i];
                                      var tempNode = new YAHOO.widget. TextNode(m.result[0]. value, node, false);
                                     
                                  }
                                  o.argument.fnLoadCo mplete();
                              },
                             
                              // Failed XHR response handler
                              failure: function(o) {
                             
                                  document.writeln( "XHR Transaction failed!");
                              },
                         
                             
                              argument: {
                                  "node": node,
                                  "fnLoadComplete" : fnLoadComplete
                              },
                         
                         
                              timeout: 7000
                             
                             
                          };
                         
                         
                          url = "/api-rest/query? f=json&o=execution- history&q=" + escape("(setofall ?x (instance-of ?x #_COBRA:ActivityIns tance))") ;
                         
                          // Make the call to the server for JSON data
                          YAHOO.util.Connect. asyncRequest( 'GET', url, callbacks);
                         
                      }
                 
              </script>
          </head>
          <body class="yui-skin- sam" onload="buildTree( )">
              <div id="tree"></div>
             
          </body>
      </html>


      I marked something red in my code as I think many of you might think there is something wrong with that specific part. But, I can assure you that this red marked part is completely ok and I tested it. When I tried the XHR part of my code separately, it worked fine and I can access the data and show them in the browser properly but problem comes when I try to use the same code in with the treeview thing. When I try to run the code, it doesn't even do anything to retreive the XHR data.


      Any one has any idea or any suggestion?

      Thanks,
      H
    Your message has been successfully submitted and would be delivered to recipients shortly.