123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246 |
- require({cache:{
- 'url:dojox/form/resources/TriStateCheckBox.html':"<div class=\"dijit dijitReset dijitInline\" role=\"presentation\"\n\t><div class=\"dojoxTriStateCheckBoxInner\" dojoAttachPoint=\"stateLabelNode\"></div\n\t><input ${!nameAttrSetting} type=\"${type}\" dojoAttachPoint=\"focusNode\"\n\tclass=\"dijitReset dojoxTriStateCheckBoxInput\" dojoAttachEvent=\"onclick:_onClick\"\n/></div>"}});
- define("dojox/form/TriStateCheckBox", [
- "dojo/_base/kernel",
- "dojo/_base/declare",
- "dojo/_base/array",
- "dojo/_base/event",
- "dojo/query",
- "dojo/dom-attr",
- "dojo/text!./resources/TriStateCheckBox.html",
- "dijit/form/ToggleButton",
- "dojo/NodeList-dom" // NodeList.addClass/removeClass
- ], function(kernel, declare, array, event, query, domAttr, template, ToggleButton){
- // module:
- // dojox/form/TriStateCheckBox
- // summary:
- // Checkbox with three states
- //
- /*=====
- ToggleButton = dijit.form.ToggleButton;
- =====*/
- return declare("dojox.form.TriStateCheckBox", ToggleButton,
- {
- // summary:
- // Checkbox with three states
- templateString: template,
- baseClass: "dojoxTriStateCheckBox",
- // type: [private] String
- // type attribute on <input> node.
- // Overrides `dijit.form.Button.type`. Users should not change this value.
- type: "checkbox",
- /*=====
- // states: Array
- // States of TriStateCheckBox.
- // The value of This.checked should be one of these three states.
- states: [false, true, "mixed"],
- =====*/
- /*=====
- // _stateLabels: Object
- // These characters are used to replace the image to show
- // current state of TriStateCheckBox in high contrast mode.
- _stateLabels: {
- "False": '',
- "True": '√',
- "Mixed": '≡'
- },
- =====*/
- /*=====
- // stateValues: Object
- // The values of the TriStateCheckBox in corresponding states.
- stateValues: {
- "False": "off",
- "True": "on",
- "Mixed": "mixed"
- },
- =====*/
- // _currentState: Integer
- // The current state of the TriStateCheckBox
- _currentState: 0,
- // _stateType: String
- // The current state type of the TriStateCheckBox
- // Could be "False", "True" or "Mixed"
- _stateType: "False",
- // readOnly: Boolean
- // Should this widget respond to user input?
- // In markup, this is specified as "readOnly".
- // Similar to disabled except readOnly form values are submitted.
- readOnly: false,
- constructor: function(){
- // summary:
- // Runs on widget initialization to setup arrays etc.
- // tags:
- // private
- this.states = [false, true, "mixed"];
- this._stateLabels = {
- "False": '',
- "True": '√',
- "Mixed": '≡'
- };
- this.stateValues = {
- "False": "off",
- "True": "on",
- "Mixed": "mixed"
- };
- },
- // Override behavior from Button, since we don't have an iconNode
- _setIconClassAttr: null,
- _setCheckedAttr: function(/*String|Boolean*/ checked, /*Boolean?*/ priorityChange){
- // summary:
- // Handler for checked = attribute to constructor, and also calls to
- // set('checked', val).
- // checked:
- // true, false or 'mixed'
- // description:
- // Controls the state of the TriStateCheckBox. Set this.checked,
- // this._currentState, value attribute of the <input type=checkbox>
- // according to the value of 'checked'.
- this._set("checked", checked);
- this._currentState = array.indexOf(this.states, checked);
- this._stateType = this._getStateType(checked);
- domAttr.set(this.focusNode || this.domNode, "checked", checked);
- domAttr.set(this.focusNode, "value", this.stateValues[this._stateType]);
- (this.focusNode || this.domNode).setAttribute("aria-checked", checked);
- this._handleOnChange(checked, priorityChange);
- },
- setChecked: function(/*String|Boolean*/ checked){
- // summary:
- // Deprecated. Use set('checked', true/false) instead.
- kernel.deprecated("setChecked("+checked+") is deprecated. Use set('checked',"+checked+") instead.", "", "2.0");
- this.set('checked', checked);
- },
- _setReadOnlyAttr: function(/*Boolean*/ value){
- this._set("readOnly", value);
- domAttr.set(this.focusNode, "readOnly", value);
- this.focusNode.setAttribute("aria-readonly", value);
- },
- _setValueAttr: function(/*String|Boolean*/ newValue, /*Boolean*/ priorityChange){
- // summary:
- // Handler for value = attribute to constructor, and also calls to
- // set('value', val).
- // description:
- // During initialization, just saves as attribute to the <input type=checkbox>.
- //
- // After initialization,
- // when passed a boolean or the string 'mixed', controls the state of the
- // TriStateCheckBox.
- // If passed a string except 'mixed', changes the value attribute of the
- // TriStateCheckBox. Sets the state of the TriStateCheckBox to checked.
- if(typeof newValue == "string" && (array.indexOf(this.states, newValue) < 0)){
- if(newValue == ""){
- newValue = "on";
- }
- this.stateValues["True"] = newValue;
- newValue = true;
- }
- if(this._created){
- this._currentState = array.indexOf(this.states, newValue);
- this.set('checked', newValue, priorityChange);
- domAttr.set(this.focusNode, "value", this.stateValues[this._stateType]);
- }
- },
- _setValuesAttr: function(/*Array*/ newValues){
- // summary:
- // Handler for values = attribute to constructor, and also calls to
- // set('values', val).
- // newValues:
- // If the length of newValues is 1, it will replace the value of
- // the TriStateCheckBox in true state. Otherwise, the values of
- // the TriStateCheckBox in true state and 'mixed' state will be
- // replaced by the first two values in newValues.
- // description:
- // Change the value of the TriStateCheckBox in 'mixed' and true states.
- this.stateValues["True"] = newValues[0] ? newValues[0] : this.stateValues["True"];
- this.stateValues["Mixed"] = newValues[1] ? newValues[1] : this.stateValues["False"];
- },
- _getValueAttr: function(){
- // summary:
- // Hook so get('value') works.
- // description:
- // Returns value according to current state of the TriStateCheckBox.
- return this.stateValues[this._stateType];
- },
- startup: function(){
- this.set("checked", this.params.checked || this.states[this._currentState]);
- domAttr.set(this.stateLabelNode, 'innerHTML', this._stateLabels[this._stateType]);
- 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(){
- this._hasBeenBlurred = false;
- this.stateValues = {
- "False" : "off",
- "True" : "on",
- "Mixed" : "mixed"
- };
- this.set('checked', this.params.checked || this.states[0]);
- },
- _onFocus: function(){
- if(this.id){
- query("label[for='"+this.id+"']").addClass("dijitFocusedLabel");
- }
- this.inherited(arguments);
- },
- _onBlur: function(){
- if(this.id){
- query("label[for='"+this.id+"']").removeClass("dijitFocusedLabel");
- }
- this.inherited(arguments);
- },
- _onClick: function(/*Event*/ e){
- // summary:
- // Internal function to handle click actions - need to check
- // readOnly and disabled
- if(this.readOnly || this.disabled){
- event.stop(e);
- return false;
- }
- if(this._currentState >= this.states.length - 1){
- this._currentState = 0;
- }else{
- this._currentState++;
- }
- this.set("checked", this.states[this._currentState]);
- domAttr.set(this.stateLabelNode, 'innerHTML', this._stateLabels[this._stateType]);
- return this.onClick(e); // user click actions
- },
- _getStateType: function(/*String|Boolean*/ state){
- // summary:
- // Internal function to return the type of a certain state
- // false: False
- // true: True
- // "mixed": Mixed
- return state ? (state == "mixed" ? "Mixed" : "True") : "False";
- }
- }
- );
- });
|