61979

Dojo : ComboBox selected and show data id

Question:

I have Dojo ComboBox with data

<pre class="lang-js prettyprint-override"> var store = new dojo.data.ItemFileReadStore( { data: { identifier: "name", items: [ {name:"Alabama", id:"AL"}, {name:"Alaska", id:"AK"}, {name:"American Samoa", id:"AS"}, {name:"Arizona", id:"AZ"}, {name:"Arkansas", id:"AR"}, {name:"Armed Forces Europe", id:"AE"}, {name:"Armed Forces Pacific", id:"AP"}, {name:"Armed Forces the Americas", id:"AA"}, {name:"California", id:"CA"}, {name:"Colorado", id:"CO"}, {name:"Connecticut", id:"CT"}, {name:"Delaware", id:"DE"} ] }}); var comboBox = new dijit.form.ComboBox({ id: "stateSelect", name: "state", value: "-- Select --", store: store, searchAttr: "name" }, "stateSelect");

and I have textbox to search data id.

Then I want to selected(ComboBox) that data. And show the data id and value .

How can I do that.

Answer1:

comboBox.item is a reference to the currently selected element.

You can get the id and value of your item through :

var id = store.getValue(comboBox.item, "id"); var name = store.getValue(comboBox.item, "name");

Then you use id and name to display the values wherever you need to...

See this jsfiddle for an example : <a href="http://jsfiddle.net/psoares/RS2Z5/" rel="nofollow">http://jsfiddle.net/psoares/RS2Z5/</a>

Answer2:

Or you can just call comboBox.item.id and comboBox.item.name in javascript....

To set the value programmically (programmically set dojo comboBox selection)..(this might not be relative to your question...just in case someone might need it) I found that the comboBox is quite buggie when you set the selected value, if you just do:

comboBox.set('value', yourValue); //such as comboBox.set('value', "Bob");

the box will update its display...but when you call comboBox.item it will return null....so what i did to set the selection of dojo ComboBox: //set the display

comboBox.set('value', yourValue); //set the actual selected item comboBox.item = comboBox.store.query({myAttributesName:"myValue"})[0]; //such as comboBox.item = comboBox.store.query({name:"Bob"})[0] it will return the Object with name = "Bob"

Then you will be fine by using comboBox.item.myAttribute to return whatever value you want after set selection.... Happy coding.....:p

Answer3:

the id and value can be accessed via comboBox.item.id and comboBox.item.name, but in my experience the comboBox.item is null until the user clicks on the ComboBox and selects an option, once they select an option then the comboBox.item is populated with the option object that was selected.

In order to select an option and set the item you can do as Vin.X suggested or you can set it in the ComboBox initialization parameters 'item' (<a href="http://dojotoolkit.org/api/?qs=1.9/dijit/form/ComboBox" rel="nofollow">http://dojotoolkit.org/api/?qs=1.9/dijit/form/ComboBox</a>)

var comboBox = new dijit.form.ComboBox({ id: "stateSelect", name: "state", store: store, searchAttr: "name", item: {name:"Alabama", id:"AL"} // or store.query({name:"Alabama"})[0] }, "stateSelect");

Hopefully it helps someone

Answer4:

you can find the answer in the official docs.

<a href="http://dojotoolkit.org/reference-guide/1.8/dijit/form/FilteringSelect.html#dijit-form-filteringselect" rel="nofollow">http://dojotoolkit.org/reference-guide/1.8/dijit/form/FilteringSelect.html#dijit-form-filteringselect</a>

dijit.byId('stateSelect').get('value') dijit.byId('stateSelect').get('displayedValue')

Answer5:

This worked for me:

<pre class="lang-js prettyprint-override">dijit.byId("mySelect").item.i.id

I don't know what "i" stands for but I got it by logging contents of dijit.byId("mySelect").item

Recommend

  • jquery - creating nested json from flat json
  • looping through arrays with foreach statement
  • No suitable driver found
  • How to update a widget on app start
  • How do i use 'auto' in C++ (C++0x)?
  • how to create temp table based on column number?
  • Dojo : ComboBox selected and show data id
  • Dojo : ComboBox selected and show data id
  • Word cloud in R with two separate values
  • std::async variant which works over a collection
  • How to use CSS locator with tag + class name + inner html text to identify a button in a span
  • R: gsub of exact full string with fixed = T
  • Write from R to Teradata in 3.0
  • Codeigniter Routing Regex
  • Populating a DropDownList with text and values
  • how to cancel HostingEnvironment.QueueBackgroundWorkItem
  • How to save dynamically created textboxes and their values
  • How Get arguments value using inline assembly in C without Glibc?
  • Image map in Flex
  • How to make R's read_csv2() recognise the text characters properly
  • Who propagate bugfixes across branches (corporate development)?
  • How to add a focus style to an editable ComboBox in WPF
  • Implementation of State Monad
  • MySQL Order by column = x, column asc?
  • How do I pass the string value parameter of the selected list item from an auto-populated dropdown l
  • Google Custom Search with transparent background
  • Email format validation in mvc3 view
  • Insert into database using onclick function
  • What is Eclipse's Declaration View used for?
  • javascript inside java/jsp code
  • Can I make an Android app that runs a web view in Chrome 39?
  • ORA-29908: missing primary invocation for ancillary operator
  • jQuery tmpl and DataLink beta
  • How to get next/previous record number?
  • SQL merge duplicate rows and join values that are different
  • Proper way to use connect-multiparty with express.js?
  • How to set the response of a form post action to a iframe source?
  • How do you join a server to an Active Directory (domain)?
  • How does Linux kernel interrupt the application?
  • How to push additional view controllers onto NavigationController but keep the TabBar?