CheckBox.js 4.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120
  1. require({cache:{
  2. 'url:dijit/form/templates/CheckBox.html':"<div class=\"dijit dijitReset dijitInline\" role=\"presentation\"\n\t><input\n\t \t${!nameAttrSetting} type=\"${type}\" ${checkedAttrSetting}\n\t\tclass=\"dijitReset dijitCheckBoxInput\"\n\t\tdata-dojo-attach-point=\"focusNode\"\n\t \tdata-dojo-attach-event=\"onclick:_onClick\"\n/></div>\n"}});
  3. define("dijit/form/CheckBox", [
  4. "require",
  5. "dojo/_base/declare", // declare
  6. "dojo/dom-attr", // domAttr.set
  7. "dojo/_base/kernel",
  8. "dojo/query", // query
  9. "dojo/ready",
  10. "./ToggleButton",
  11. "./_CheckBoxMixin",
  12. "dojo/text!./templates/CheckBox.html",
  13. "dojo/NodeList-dom" // NodeList.addClass/removeClass
  14. ], function(require, declare, domAttr, kernel, query, ready, ToggleButton, _CheckBoxMixin, template){
  15. /*=====
  16. var ToggleButton = dijit.form.ToggleButton;
  17. var _CheckBoxMixin = dijit.form._CheckBoxMixin;
  18. =====*/
  19. // module:
  20. // dijit/form/CheckBox
  21. // summary:
  22. // Checkbox widget
  23. // Back compat w/1.6, remove for 2.0
  24. if(!kernel.isAsync){
  25. ready(0, function(){
  26. var requires = ["dijit/form/RadioButton"];
  27. require(requires); // use indirection so modules not rolled into a build
  28. });
  29. }
  30. return declare("dijit.form.CheckBox", [ToggleButton, _CheckBoxMixin], {
  31. // summary:
  32. // Same as an HTML checkbox, but with fancy styling.
  33. //
  34. // description:
  35. // User interacts with real html inputs.
  36. // On onclick (which occurs by mouse click, space-bar, or
  37. // using the arrow keys to switch the selected radio button),
  38. // we update the state of the checkbox/radio.
  39. //
  40. // There are two modes:
  41. // 1. High contrast mode
  42. // 2. Normal mode
  43. //
  44. // In case 1, the regular html inputs are shown and used by the user.
  45. // In case 2, the regular html inputs are invisible but still used by
  46. // the user. They are turned quasi-invisible and overlay the background-image.
  47. templateString: template,
  48. baseClass: "dijitCheckBox",
  49. _setValueAttr: function(/*String|Boolean*/ newValue, /*Boolean*/ priorityChange){
  50. // summary:
  51. // Handler for value= attribute to constructor, and also calls to
  52. // set('value', val).
  53. // description:
  54. // During initialization, just saves as attribute to the <input type=checkbox>.
  55. //
  56. // After initialization,
  57. // when passed a boolean, controls whether or not the CheckBox is checked.
  58. // If passed a string, changes the value attribute of the CheckBox (the one
  59. // specified as "value" when the CheckBox was constructed (ex: <input
  60. // data-dojo-type="dijit.CheckBox" value="chicken">)
  61. // widget.set('value', string) will check the checkbox and change the value to the
  62. // specified string
  63. // widget.set('value', boolean) will change the checked state.
  64. if(typeof newValue == "string"){
  65. this._set("value", newValue);
  66. domAttr.set(this.focusNode, 'value', newValue);
  67. newValue = true;
  68. }
  69. if(this._created){
  70. this.set('checked', newValue, priorityChange);
  71. }
  72. },
  73. _getValueAttr: function(){
  74. // summary:
  75. // Hook so get('value') works.
  76. // description:
  77. // If the CheckBox is checked, returns the value attribute.
  78. // Otherwise returns false.
  79. return (this.checked ? this.value : false);
  80. },
  81. // Override behavior from Button, since we don't have an iconNode
  82. _setIconClassAttr: null,
  83. postMixInProperties: function(){
  84. this.inherited(arguments);
  85. // Need to set initial checked state as part of template, so that form submit works.
  86. // domAttr.set(node, "checked", bool) doesn't work on IE until node has been attached
  87. // to <body>, see #8666
  88. this.checkedAttrSetting = this.checked ? "checked" : "";
  89. },
  90. _fillContent: function(){
  91. // Override Button::_fillContent() since it doesn't make sense for CheckBox,
  92. // since CheckBox doesn't even have a container
  93. },
  94. _onFocus: function(){
  95. if(this.id){
  96. query("label[for='"+this.id+"']").addClass("dijitFocusedLabel");
  97. }
  98. this.inherited(arguments);
  99. },
  100. _onBlur: function(){
  101. if(this.id){
  102. query("label[for='"+this.id+"']").removeClass("dijitFocusedLabel");
  103. }
  104. this.inherited(arguments);
  105. }
  106. });
  107. });