Question

I cannot figure how to apply the condition to the result after the query.
This code was asked before but I wanted to enhance it

require(["dojo/parser", "dojo/ready", "dojo/query", "dojo/on", "dijit/form/Select", "dojo/domReady!"], function (parser, ready, query, on, Select) {
ready(function () {
    parser.parse();

    var select_Card = new Select({
        name: 'select_PCBA',
        options: [{
            label: "<span id='NotinUse'><b>&nbsp&nbsp&nbsp. . .</b></span>",
            value: "",
            selected: true
        }, {
            label: "<span id='NotinUse'><b>&nbsp&nbspMk7ABC Card</b></span>",
            value: "testdata1970_05"
        }, {
            label: "<span id='inUse'><b>&nbsp&nbspMk7CBC Card</b></span>",
            value: "testdata1970_10"
        }, {
            label: "<span id='NotinUse'><b>&nbsp&nbspMk10DC Card</b></span>",
            value: "testdata2060_03"
        }, {
            label: "<span id='NotinUse'><b>&nbsp&nbspMk6BC Card</b></span>",
            value: "dbProdigy"
        }, {
            label: "<span id='NotinUse'><b>&nbsp&nbspMk6NBC Card</b></span>",
            value: "dbProdigy_MK6N"
        }, ],
        style: {
            width: '150px'
        }
    }, "select_Card");

    select_Card.startup();


    on(select_Card, 'change', function(newValue)
    {
        if query('#inUse')
        {
            alert('Item selected is '+ newValue);
        }
        else
        {
            alert('Please select the only highlighted card');                           
        }
    });
    });
});

OR Please see my jsfiddle for your convenience.

Or do you have better way?

Please advise
Thanks

Clement

Answer 1

I have updated your jsFiddle: http://jsfiddle.net/fredfortier/q5LC7/11/. A few things were wrong with it. I cleaned-up the “ready” stuff to make it run.

I believe that there are a few issues with the structure of the code that you might want to clean-up. But I did not want to change your code too much so I just made it work. One major thing is that you were using the same ids multiple time. I changed it to class. Also, the query function is not scoped to a closure, it will search through the dom. So your condition in the event handler would never have worked.

Again, I do not think that this code if very polished and could be tackled differently, but here it is working without major changes to what you had:

require(["dojo/parser", "dojo/ready", "dojo/query", "dojo/on", "dijit/form/Select", "dojo/_base/array", "dojo/domReady!"], function (parser, ready, query, on, Select, array) {

    console.debug('rendering...');
    var select_Card = new Select({
        name: 'select_PCBA',
        options: [{
            label: "<span class='NotinUse'><b>&nbsp&nbsp&nbsp. . .</b></span>",
            value: "",
            selected: true
        }, {
            label: "<span class='NotinUse'><b>&nbsp&nbspMk7ABC Card</b></span>",
            value: "testdata1970_05"
        }, {
            label: "<span class='inUse'><b>&nbsp&nbspMk7CBC Card</b></span>",
            value: "testdata1970_10"
        }, {
            label: "<span class='NotinUse'><b>&nbsp&nbspMk10DC Card</b></span>",
            value: "testdata2060_03"
        }, {
            label: "<span class='NotinUse'><b>&nbsp&nbspMk6BC Card</b></span>",
            value: "dbProdigy"
        }, {
            label: "<span class='NotinUse'><b>&nbsp&nbspMk6NBC Card</b></span>",
            value: "dbProdigy_MK6N"
        }, ],
        style: {
            width: '150px'
        }
    }, "select_Card");

    select_Card.startup();

    on(select_Card, 'change', function(newValue)
    {
        console.debug('got selected value:', newValue, 'from options:', select_Card.options);
        array.forEach(select_Card.options, function(option) {
            if (option.value == newValue) {
                  console.debug('found selected option in the list: ', option);
                  if (option.label.indexOf("'inUse'") != -1) {
                        alert('Item selected is '+ newValue)
                  } else {
                        alert('Please select the only highlighted card');
                  }
            }
        });
    });

});