dojo.provide("dijit.form.CheckBox");
dojo.require("dijit.form.Button");
dojo.declare(
"dijit.form.CheckBox",
dijit.form.ToggleButton,
{
// summary:
// Same as an HTML checkbox, but with fancy styling.
//
// description:
// User interacts with real html inputs.
// On onclick (which occurs by mouse click, space-bar, or
// using the arrow keys to switch the selected radio button),
// we update the state of the checkbox/radio.
//
// There are two modes:
// 1. High contrast mode
// 2. Normal mode
// In case 1, the regular html inputs are shown and used by the user.
// In case 2, the regular html inputs are invisible but still used by
// the user. They are turned quasi-invisible and overlay the background-image.
templatePath: dojo.moduleUrl("dijit.form", "templates/CheckBox.html"),
baseClass: "dijitCheckBox",
// type: [private] String
// type attribute on node.
// Overrides `dijit.form.Button.type`. Users should not change this value.
type: "checkbox",
// value: String
// As an initialization parameter, equivalent to value field on normal checkbox
// (if checked, the value is passed as the value when form is submitted).
//
// However, attr('value') will return either the string or false depending on
// whether or not the checkbox is checked.
//
// attr('value', string) will check the checkbox and change the value to the
// specified string
//
// attr('value', boolean) will change the checked state.
value: "on",
_setValueAttr: function(/*String or Boolean*/ newValue){
// summary:
// Handler for value= attribute to constructor, and also calls to
// attr('value', val).
// description:
// During initialization, just saves as attribute to the .
//
// After initialization,
// when passed a boolean, controls whether or not the CheckBox is checked.
// If passed a string, changes the value attribute of the CheckBox (the one
// specified as "value" when the CheckBox was constructed (ex: )
if(typeof newValue == "string"){
this.value = newValue;
dojo.attr(this.focusNode, 'value', newValue);
newValue = true;
}
if(this._created){
this.attr('checked', newValue);
}
},
_getValueAttr: function(){
// summary:
// Hook so attr('value') works.
// description:
// If the CheckBox is checked, returns the value attribute.
// Otherwise returns false.
return (this.checked ? this.value : false);
},
postMixInProperties: function(){
if(this.value == ""){
this.value = "on";
}
// Need to set initial checked state as part of template, so that form submit works.
// dojo.attr(node, "checked", bool) doesn't work on IEuntil node has been attached
// to , see #8666
this.checkedAttrSetting = this.checked ? "checked" : "";
this.inherited(arguments);
},
_fillContent: function(/*DomNode*/ source){
// Override Button::_fillContent() since it doesn't make sense for CheckBox,
// since CheckBox doesn't even have a container
},
reset: function(){
// Override ToggleButton.reset()
this._hasBeenBlurred = false;
this.attr('checked', this.params.checked || false);
// Handle unlikely event that the value attribute has changed
this.value = this.params.value || "on";
dojo.attr(this.focusNode, 'value', this.value);
},
_onFocus: function(){
if(this.id){
dojo.query("label[for='"+this.id+"']").addClass("dijitFocusedLabel");
}
},
_onBlur: function(){
if(this.id){
dojo.query("label[for='"+this.id+"']").removeClass("dijitFocusedLabel");
}
}
}
);
dojo.declare(
"dijit.form.RadioButton",
dijit.form.CheckBox,
{
// summary:
// Same as an HTML radio, but with fancy styling.
type: "radio",
baseClass: "dijitRadio",
_setCheckedAttr: function(/*Boolean*/ value){
// If I am being checked then have to deselect currently checked radio button
this.inherited(arguments);
if(!this._created){ return; }
if(value){
var _this = this;
// search for radio buttons with the same name that need to be unchecked
dojo.query("INPUT[type=radio]", this.focusNode.form||dojo.doc).forEach( // can't use name= since dojo.query doesn't support [] in the name
function(inputNode){
if(inputNode.name == _this.name && inputNode != _this.focusNode && inputNode.form == _this.focusNode.form){
var widget = dijit.getEnclosingWidget(inputNode);
if(widget && widget.checked){
widget.attr('checked', false);
}
}
}
);
}
},
_clicked: function(/*Event*/ e){
if(!this.checked){
this.attr('checked', true);
}
}
}
);