title: populate dropdown list with dojo ajax
body: <p>hey i am using the following code to make cascading dropdown in which , i made one function xyz() in which am ajax is called who call a servlet and set the value in result variable , the value in result is in separated by comma so i split it with comma and the store into second drop down .. now the problem is when i change the 1st dropdown 2nd dropdown is not populated but the ajax is called , and when i change the value second time then 2nd dropdwn is populate with wrong value which is i select previews .. please tell me whats wrong</p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
      &lt;meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/&gt;
  
      &lt;link rel="stylesheet" href="js/dojo/dijit/themes/claro/document.css"/&gt;
      &lt;link rel="stylesheet" href="js/dojo/dijit/themes/claro/claro.css" /&gt;
      &lt;script src='js/dojo/dojo/dojo.js' data-dojo-config=' parseOnLoad: true'&gt;&lt;/script&gt;
      &lt;script&gt;
          dojo.require("dijit.form.ComboBox");
          dojo.require("dojo.data.ItemFileReadStore");
          dojo.require("dojo.ready");
          dojo.require("dojo.store.Memory");
          require(["dojo/parser", "dijit/form/ComboBox","dijit/form/TextBox","dojo/dom-construct"]);
       function xyz(){
        dojo.xhrPost({
              // The URL to request
              url: "populate",
              timeout :  3000 ,
              content: {
                  username: document.getElementById("state").value
  
              },
  
              load: function(result) {                
           require(["dijit/form/ComboBox", "dojo/ready","dojo/store/Memory"], 
                  function(ComboBox,ready,Memory){
  
                      ready(function() {
  
                          dojo.connect(dijit.byId('state'), 'onChange', function() {
  
                              var stateSelect = dijit.byId('stateSelect');
  
                              if (!stateSelect) {
                                  stateSelect = new ComboBox({id: "stateSelect",name:"select",value: "Select",searchAttr:"name"},"stateSelect");
  
                              }
  
                              var str_array = result.split(',');
  
                              var data = [];
                              dojo.forEach(str_array, function(item, idx) {
                                  data.push({
                                      id: idx,
                                      name: item                    
                                  });
                                  stateSelect.set('store', new Memory({data: data}));
  
  
                              });
  
  
                          }); // dojo.connect
  
  
  
                      }); // ready   
  
  
  
                  }); // require  
  
          }
  
  
  
        });
  
      }
  
  
      &lt;/script&gt;
  &lt;/head&gt;
  &lt;body class="claro"&gt;
  
      &lt;select data-dojo-type="dijit.form.ComboBox" id="state" name="state" onchange="xyz()"  &gt;
  
          &lt;option selected&gt;Andaman Nicobar&lt;/option&gt;
          &lt;option&gt;Andhra Pradesh&lt;/option&gt;
          &lt;option&gt;Arunachal Pradesh&lt;/option&gt;
  
  
      &lt;/select&gt;
  
      &lt;select data-dojo-type="dijit.form.ComboBox" id="stateSelect" name="stateSelect"&gt;
  
      &lt;/select&gt;
  
  
  &lt;/body&gt;
  </code></pre>
  
  <p></p>