I am trying to change the value of the searchAttr of the combo box based on a radio button. Here is a working snippet of what I have so far.
<html>
<head>
<title>Test</title>
<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/dojo/1.9.1/dijit/themes/claro/claro.css">
<script>
dojoConfig = {
parseOnLoad: true
}
</script>
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/dojo/1.9.1/dojo/dojo.js"></script>
<script type="text/javascript">
require([
"dojo/store/Memory", "dijit/form/ComboBox", "dojo/domReady!"
], function(Memory, ComboBox) {
var infoStore = new Memory({
data: [{
"prop1": "a1",
"prop2": "a2"
}, {
"prop1": "b1",
"prop2": "b2"
}, {
"prop1": "c1",
"prop2": "c2"
}]
});
var comboBox = new ComboBox({
id: "combo_id",
name: "info",
store: infoStore,
searchAttr: "prop1"
}, "combo_id");
});
</script>
</head>
<body class="claro">
<div>
<input type="radio" name="searchType" id="search_type_one" />
<label for="search_type_one">Search Type One</label>
<input type="radio" name="searchType" id="search_type_two" />
<label for="search_type_two">Search Type Two</label>
</div>
<input id="combo_id" />
<p>
<button onClick="alert(dijit.byId('combo_id').get('value'))">Get value</button>
</p>
</body>
</html>Here is the pseudo code for what I am trying to accomplish
searchAttr: function (item){
if (searchType.value == "one"){
return item.prop1;
} else if (searchType == "two"){
return item.prop2;
}
}
The vanilla way to do this is to bind an
onChangeevent handler in yourrequirecallback to a selector likeinput[name=searchType], updatingcomboBox.searchAttreach time the change event fires.There may be a more dojo-specific way to do it, but I can't help with that!