title: Use of Dojo 1.8 functions to execute on JSF ajax result
body: <p>I am new to Dojo (and in fact all front end programming, I have been working on server side for years in Java and C#).  I am currently working with Java Server Faces (JSF) 2.1 and trying to put together a simple demo using JSF and Dojo Grid (dgrid) with Dojo 1.8.  I have a example from the dgrid site that shows how to work with making a Gantt chart, but this example doesn't show how to extract JSON data from an application server and feed it to the function.  The problem is that I am having a hard time wrapping my brain around ARM - I am hoping some experience out there can help reduce some of my pain.  Here is some code:</p>
  
  <p>This is in the html file I created, when loading, it just creates the gantt:</p>
  
  <pre><code>&lt;script&gt;
      require([ "gantt/GanttGrid", "gantt/data" ], function(GanttGrid, data){
          // Instantiate the GanttGrid using predefined test data
          new GanttGrid({
              store: data,
              query: {
                  // Only tasks with no parent task should be displayed in the root of the chart
                  parent: undefined
              }
          }, "gantt");
      });
  &lt;/script&gt;
  </code></pre>
  
  <p>"data" is pulled from a separate js file and is just JSON data that is slurped into the DOJO's Memory object:</p>
  
  <pre><code>define(["dojo/store/Memory"],function(Memory){
  return new Memory({data:[
          {name: "100", start: 1327900000000, end: 1328300000000, completed: 0.9, id: 1},
          {name: "101", start: 1328100000000, end: 1328400000000, completed: 0.9, id: 2},
          {name: "102", start: 1329100000000, end: 1329800000000, completed: 0.4, dependencies:[1], id: 3},
          {name: "103", start: 1328400000000, end: 1328900000000, completed: 0.4, dependencies:[1], id: 4},
          {name: "104", start: 1329000000000, end: 1329800000000, completed: 0.4, id: 5},
          {name: "105", start: 1329000000000, end: 1329400000000, completed: 0.4, id: 6},
          {name: "106", start: 1329400000000, end: 1329800000000, completed: 0.4, id: 7}
      ],
      getChildren: function(parent, options){
          return this.query({parent: parent.id}, options);
      },
      mayHaveChildren: function(parent){
          return parent.hasChildren;
      }
  });});
  </code></pre>
  
  <p>Now, what I want is to be able to call a JSF Managed Bean's method that will execute some logic on the backend and then return JSON data that I can add to DOJO's Memory store and pass that into GanttGrid, however, I can't seem to figure out how to pull that off with an ajax request.</p>
  
  <p>Here is what I have in my XHTML file that successfully gets the data from the bean and displays it on the screen:</p>
  
  <pre><code>&lt;fieldset&gt;
      &lt;h:form id="schedulerForm"&gt;
          &lt;h:commandButton value="Execute Demo" id="executeDemo"&gt;
              &lt;f:ajax event="click" listener="#{autoScheduler.executeDemo}" render="result"  /&gt;
          &lt;/h:commandButton&gt;
          &lt;p /&gt;
          &lt;h:outputText id="result" value="#{autoScheduler.result}"  /&gt;
      &lt;/h:form&gt;
  &lt;/fieldset&gt;
  </code></pre>
  
  <p>What i would like is to capture the result of executeDemo on the JSF bean to pass to a function that creates the GanttGrid.  I have tried using the "on" functionality in DOJO, but that only allows me to capture the button click (from what i can tell) ... I can't figure a way to know when the execution is complete so that I can get the data from the bean and create a chart.  The biggest problems is that I can't figure out how I might call JSF beans with the DOJO request module.</p>
  
  <p>I hope someone knows an easy way to accomplish this.  Thanks ahead of time for any help!  Please do let me know if you need more info... I tried to include all the relevant code.</p>
  
  <p>-Paul</p>