RCK69
RCK69

Reputation: 909

dojo dijit.form.select : getting data out of the dataStore?

I am using dojo and want to populate a dijit.form.select widget from a dataStore (this works). Whenever I make a selection in the select-widget, other fields from my dataStore should be read and then be displayed in the textBoxes on the page.

Unfortunately I dont know how to read the other fields from my data store. Here is my code:

http://jsbin.com/xxx

The important stuff happens if you scroll all the way down.

Here is the javascript Object which is then read into the dataStore:

  var jsonData = {"identifier":"name",
                  "label": "subject_main",
                  "items": [
    {"name":"departure",   "subject_main":"123",  "subject_1":"sub1", "subject_2":"sub2"},
    {"name":"direct",       "subject_main":"456",  "subject_1":"sub1", "subject_2":"sub2"},
    {"name":"Messaging",           "subject_main":"789",  "subject_1":"sub1", "subject_2":"sub2"},
    {"name":"exchange",      "subject_main":"1011", "subject_1":"sub1", "subject_2":"sub2"},
    {"name":"Zilo",                "subject_main":"1213", "subject_1":"sub1", "subject_2":"sub2"},
    {"name":"Stub_implementation",            "subject_main":"1415", "subject_1":"sub1", "subject_2":"sub2"},
    {"name":"Standard_implementation",  "subject_main":"1617", "subject_1":"sub1", "subject_2":"sub2"}
                        ]};
  </script>

For ex when I select "name":"Messaging", "subject_main":"789", "subject_1":"sub1", "subject_2":"sub2"

Messaging should be displayed in my dijit.

EDIT: Lucian helped me a lot! Here is my final solution for the problem:

<title>Hello Dijit!</title>
<!-- load Dojo -->
<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/dojo/1.8.1/dijit/themes/claro/claro.css">
<script src="//ajax.googleapis.com/ajax/libs/dojo/1.8.1/dojo/dojo.js"

data-dojo-config="isDebug: true, async: true, parseOnLoad: true">

Beladeauftrag Adresse

Navigation>

<label for="load">Laden am</label><br>
<input type="text" value=""
data-dojo-type="dijit/form/TextBox"
data-dojo-props="trim:true, propercase:true" id="load" /><br>

<label for="from">von</label><br>
<input type="text" value=""
data-dojo-type="dijit/form/TextBox"
data-dojo-props="trim:true, propercase:true" id="from" /><br>

<label for="till">bis</label><br>
<input type="text" value=""
data-dojo-type="dijit/form/TextBox"
data-dojo-props="trim:true, propercase:true" id="till" /><br> 
  <script>
    // load requirements for declarative widgets in page content
require(["dijit/form/Button", "dojo/parser", "dijit/form/TextBox", "dojo/domReady!", "dojo/data/ItemFileReadStore"]);   </script>
 <br>   <br>
 <h2>WF auswählen</h2>   <div id="stateSelect"></div>
   <script> 

   require(["dijit/form/Select", "dojo/store/Memory",
            "dojo/json", "dijit/registry" , "dojo/ready"],
        function(Select, Memory, json, registry, ready) {



            ready(function(){

                              var jsonData = {"identifier":"name",
              "label": "subject_main",
              "items": [
{"name":"Auftrag 1",   "subject_main":"123",  "subject_1":"sub1", "subject_2":"sub2"},    {"name":"Auftrag 2",   "subject_main":"456", 

"subject_1":"sub1", "subject_2":"sub2"} ]};

        var store1 = new dojo.data.ItemFileReadStore({ data: jsonData });

              // code useless - nut dijit.form.select fanishes without it (??)

                // create Select widget, populating its options from the store
                var select = new Select({
                    name: "WorflowSelect",
                    store: store1,
                    style: "width: 200px;",
                    labelAttr: "name",
                    maxHeight: -1, // tells _HasDropDown to fit menu within viewport

                    myAttr1: "this.get(name)",
                    myAttr2: "subject_2",


                    onChange: function(value){
                      // get references to widgets
                      adressW=dijit.byId("adress");
                      loadW=dijit.byId("load");
                      fromW=dijit.byId("from");
                      tillW=dijit.byId("till");

                      adressW.attr("value",  "subject_main from js-object");
                      loadW.attr("value",    "subject_1 from js-object");
                      fromW.attr("value",    "subject_2 from js-object");                          

                      tillW.attr("value", 
                                 store1._getItemByIdentity("Auftrag 1").subject_main);

                    }
                }, "stateSelect");
                select.startup();
            });
    }); </script> </body> </html>

Upvotes: 0

Views: 2623

Answers (1)

Lucian Depold
Lucian Depold

Reputation: 2019

You are doing it a funny way ! Why do you define the store using a span Element ?

Take a look at this post:

Dojo how to get JSON attribute from dojo.data.ItemFileReadStore

UPDATE:

Thats how you should do it:

http://jsbin.com/osiniv/3/edit

Lucian

Upvotes: 1

Related Questions