JavaScript Tutorial/Dojo toolkit/ComboBox — различия между версиями
Admin (обсуждение | вклад) м (1 версия) |
|
(нет различий)
|
Текущая версия на 11:24, 26 мая 2010
Содержание
ComboBox on change event
<source lang="javascript">
<html>
<head> <link rel="StyleSheet" type="text/css" href="js/dojo/dijit/themes/tundra/tundra.css"> <script type="text/javascript"> var djConfig = { baseScriptUri : "js/dojo/", parseOnLoad : true }; </script> <script type="text/javascript" src="js/dojo/dojo/dojo.js"></script> <script> dojo.require("dojo.parser"); dojo.require("dijit.form.ruboBox"); function setVal1(value) { alert("Selected "+value); } </script> </head> <body class="tundra"> <select name="country" dojoType="dijit.form.ruboBox" autocomplete="false" value="country" onChange="setVal1"> <option>India</option> <option>California</option> <option>Illinois</option> <option>New York</option> <option>Texas</option> </select> </body>
</html></source>
ComboBox on change event with dojo event
<source lang="javascript">
<html>
<head> <link rel="StyleSheet" type="text/css" href="js/dojo/dijit/themes/tundra/tundra.css"> <script type="text/javascript"> var djConfig = { baseScriptUri : "js/dojo/", parseOnLoad : true }; </script> <script type="text/javascript" src="js/dojo/dojo/dojo.js"></script> <script> dojo.require("dojo.parser"); dojo.require("dijit.form.ruboBox"); </script> </head> <body class="tundra"> <select name="coffee" dojoType="dijit.form.ruboBox" autoComplete="true"> <option value=A1>A1</option> <option value=A2>A2</option> <option value=A3>A3</option> <option value=A4 selected>A4</option> <script type="dojo/method" event="onChange" args="newValue"> alert("value changed to ", newValue); </script>
</select>
</body> </html></source>
Create dojo.ComboBox
<source lang="javascript">
<html>
<head> <link rel="StyleSheet" type="text/css" href="js/dojo/dijit/themes/tundra/tundra.css"> <script type="text/javascript"> var djConfig = { baseScriptUri : "js/dojo/", parseOnLoad : true }; </script> <script type="text/javascript" src="js/dojo/dojo/dojo.js"></script> <script> dojo.require("dojo.parser"); dojo.require("dijit.form.ruboBox"); dojo.require("dojo.data.ItemFileWriteStore"); function createProgrammatically() { var options = new dojo.data.ItemFileWriteStore({ data: { identifier : "name", items : [ {name : "A"}, {name : "B"}, {name : "C"} ] } }); var myDijit = new dijit.form.ruboBox({ store : options }); dojo.byId("my").appendChild(myDijit.domNode); } </script> </head> <body class="tundra" onLoad="createProgrammatically();">
</body>
</html></source>
Create dojo ComboBox declaratively
<source lang="javascript">
<html>
<head> <link rel="StyleSheet" type="text/css" href="js/dojo/dijit/themes/tundra/tundra.css"> <script type="text/javascript"> var djConfig = { baseScriptUri : "js/dojo/", parseOnLoad : true }; </script> <script type="text/javascript" src="js/dojo/dojo/dojo.js"></script> <script> dojo.require("dojo.parser"); dojo.require("dijit.form.ruboBox"); dojo.require("dojo.data.ItemFileWriteStore"); </script> </head> <body class="tundra"> <select dojoType="dijit.form.ruboBox" value="" autocomplete="true" hasDownArrow="true"> <option>A</option> <option>B</option> <option>C</option> </select> </body>
</html></source>
Force ComboBox to valid
<source lang="javascript">
<html>
<head> <link rel="StyleSheet" type="text/css" href="js/dojo/dijit/themes/tundra/tundra.css"> <script type="text/javascript"> var djConfig = { baseScriptUri : "js/dojo/", parseOnLoad : true }; </script> <script type="text/javascript" src="js/dojo/dojo/dojo.js"></script> <script> dojo.require("dojo.parser"); dojo.require("dijit.form.ValidationTextBox"); dojo.require("dijit.form.ruboBox"); dojo.require("dojo.data.ItemFileReadStore"); </script> </head> <body class="tundra"> <label for="city">City: </label> <input type="text" id="city" name="city" title="city" dojoType="dijit.form.ruboBox" autoComplete="true" forceValidOption="false" />
</body> </html></source>
Set ComboBox auto-complete to false
<source lang="javascript">
<html>
<head> <link rel="StyleSheet" type="text/css" href="js/dojo/dijit/themes/tundra/tundra.css"> <script type="text/javascript"> var djConfig = { baseScriptUri : "js/dojo/", parseOnLoad : true }; </script> <script type="text/javascript" src="js/dojo/dojo/dojo.js"></script> <script> dojo.require("dojo.parser"); dojo.require("dijit.form.ruboBox"); function setVal1(value) { alert("Selected "+value); } </script> </head> <body class="tundra"> <select name="country" dojoType="dijit.form.ruboBox" autocomplete="false" value="country" onChange="setVal1"> <option>India</option> <option>California</option> <option>Illinois</option> <option>New York</option> <option>Texas</option> </select> </body>
</html></source>