How to save Id for dijit.form.ComboBox

Question

I'm writing my first dijit control for EPiServer. In my template I am using the dijit.form.ComboBox.

I have attached an event handler to the "onChange" event like so:

postCreate: function () {
        // call base implementation
        this.inherited(arguments);

        // Init textarea and bind event
        this.inputWidget.set("intermediateChanges", this.intermediateChanges);

        this.inputWidget.set("store", this.store);
        this.connect(this.inputWidget, "onChange", this._onInputWidgetChanged);
    },

Then in my event handler I have:

        _onInputWidgetChanged: function (e) {
        alert(e.id);
        this._updateValue(value);
    },

My issue is that as with a typical dropdown list, I want to store the Value rather than the Text. The options in my combobox look like so:

Value | Text 1 | "Test" 2 | "A different test"

The problem is that the value passed into the _onInputWidgetChanged handler is always the text value of the combobox i.e. "Test" or "A different test"

How can I get access to the Value instead? As I said, this is the first time I have ever worked with dojo and dijit so I may be missing something fundamental here.

Thanks in advance Al

I know this.inputWidget.get('value') would work for other widgets, see if it works in this case. — Kryptic, Sep 27 '13 at 17:02

score 1 · Accepted Answer · answered Sep 28 '13 at 01:43

1

The thing about ComboBox is that its value is not required to be an entry in the drop-down menu (and thus, not guaranteed to be one either). Think of it as a textbox with autosuggest - users can use the menu to expedite the process, but the value of the textbox is freeform and is reported as whatever the user types into it.

If you want users to be required to choose an entry from the menu, you should be using FilteringSelect instead, which will report the associated store item's ID (or associated option tag's value) as its value. As opposed to the free-form nature of ComboBox, FilteringSelect can be thought of as a menu with type-ahead functionality.

answered Sep 28 '13 at 01:43

Ken Franqueiro

10,559
2
23
40

`dijit/form/FilteringSelect` definitely seems like a better fit than `dijit/form/ComboBox` in this case. Great answer. [Here's the documentation](http://dojotoolkit.org/reference-guide/1.9/dijit/form/FilteringSelect.html) for `FilteringSelect`, and [here's a fiddle demonstrating its use](http://jsfiddle.net/tupton/MFeXn/). It logs the id (not the name) when you select a value. – Thomas Upton Sep 28 '13 at 18:13
Hi, thanks for your response. And does FilteringSelect allow the user type and as they do so Filter the results? I have a list of 1500 users and I don't want to return the whole set if users in the list for obvious reasons, so as the user types "al" I want to call a rest service that will return users starting with "AI". Is that how it works? – higgsy Sep 29 '13 at 20:01
Yes, in terms of how the menu itself works, it works the same way as ComboBox. See the examples in the documentation (linked by Thomas). – Ken Franqueiro Sep 29 '13 at 20:11

How to save Id for dijit.form.ComboBox

1 Answers1