steve_li

dojo CheckedMultiSelect from store

Discussion created by steve_li on Jan 24, 2012
Latest reply on Jan 26, 2012 by DSwingley-esristaff
I am very new to Dojo and I have a question hope someone can help me.

I want to populate CheckedMultiSelect with a data store, but I can't make it work.  Can someone tell what I did wrong?  Thanks.

Here is the code:

<!DOCTYPE html>
<html>
<head>
  <title>Dive Into Dijit Forms Examples</title>
 
  <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/dojo/1.6.1/dojo/resources/dojo.css">
  <link rel="stylesheet" id="themeStyles" href="http://ajax.googleapis.com/ajax/libs/dojo/1.6.1/dijit/themes/claro/claro.css">
  <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/dojo/1.6.1/dojox/grid/resources/claroGrid.css">
  <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/dojo/1.6.1/dojox/form/resources/CheckedMultiSelect.css">
 
  <!--script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/dojo/1.5/dojo/dojo.xd.js.uncompressed.js" djConfig="isDebug:false,parseOnLoad:true"></script-->
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/dojo/1.6.1/dojo/dojo.xd.js" djConfig="isDebug:true,parseOnLoad:true"></script>

  <script type="text/javascript">
   dojo.require("dojo.parser");
   dojo.require("dojox.form.CheckedMultiSelect");
   dojo.require("dijit.form.Button");
   dojo.require("dijit.form.Form");
   dojo.require("dojo.data.ItemFileWriteStore");
   var readStore;
   //var readStore;
  
   dojo.ready(function(){
    var data = {
     identifier: "value",
     label: "label",
     items: [
      {value: "AL", label: "Alabama"},
      {value: "AK", label: "Alaska"},
      {value: "AZ", label: "Arizona"},
      {value: "AR", label: "Arkansas"},
      {value: "CA", label: "California"},
      {value: "CO", label: "Colorado"},
      {value: "CT", label: "Connecticut"}
     ]
    };
  
    var readStore = new dojo.data.ItemFileReadStore({data:dojo.clone(data)});
   });
   
  </script>
</head>

<body class="claro">
 
  <div style="padding:20px;">
 
  <form dojoType="dijit.form.Form" jsId="form">
   <select jsId="ms4" multiple="true" size="5" name="ms4" store="readStore" dojoType="dojox.form.CheckedMultiSelect">
   </select>
  </form>
  </div>
 
</body>
</html>

Outcomes