Add basic radio, readonly version of checkbox/radio

This commit is contained in:
Nathan Gray 2011-08-18 17:34:01 +00:00
parent 3c5f14e960
commit 5e54d6b12b
4 changed files with 148 additions and 5 deletions

View File

@ -15,6 +15,7 @@
/*egw:uses /*egw:uses
jquery.jquery; jquery.jquery;
et2_inputWidget; et2_inputWidget;
et2_valueWidget;
*/ */
/** /**
@ -23,17 +24,29 @@
var et2_checkbox = et2_inputWidget.extend({ var et2_checkbox = et2_inputWidget.extend({
attributes: { attributes: {
"set_value": { "selected_value": {
"name": "Set value", "name": "Set value",
"type": "string", "type": "string",
"default": "true", "default": "true",
"description": "Value when checked" "description": "Value when checked"
}, },
"unset_value": { "unselected_value": {
"name": "Unset value", "name": "Unset value",
"type": "string", "type": "string",
"default": "false", "default": "false",
"description": "Value when not checked" "description": "Value when not checked"
},
"ro_true": {
"name": "Read only selected",
"type": "string",
"default": "x",
"description": "What should be displayed when readonly and selected"
},
"ro_false": {
"name": "Read only unselected",
"type": "string",
"default": "",
"description": "What should be displayed when readonly and not selected"
} }
}, },
@ -60,7 +73,7 @@ var et2_checkbox = et2_inputWidget.extend({
*/ */
set_value: function(_value) { set_value: function(_value) {
if(_value != this.value) { if(_value != this.value) {
if(_value == this.set_value) { if(_value == this.selected_value) {
this.input.attr("checked", "checked"); this.input.attr("checked", "checked");
} else { } else {
this.input.removeAttr("checked"); this.input.removeAttr("checked");
@ -73,11 +86,51 @@ var et2_checkbox = et2_inputWidget.extend({
*/ */
getValue: function() { getValue: function() {
if(this.input.attr("checked")) { if(this.input.attr("checked")) {
return this.set_value; return this.selected_value;
} else { } else {
return this.unset_value; return this.unselected_value;
} }
} }
}); });
et2_register_widget(et2_checkbox, ["checkbox"]); et2_register_widget(et2_checkbox, ["checkbox"]);
/**
* et2_checkbox_ro is the dummy readonly implementation of the checkbox and radio.
*/
var et2_checkbox_ro = et2_checkbox.extend({
/**
* Ignore unset value
*/
attributes: {
"unselected_value": {
"ignore": true
}
},
init: function(_parent) {
},
init: function() {
this._super.apply(this, arguments);
this.value = "";
this.span = $j(document.createElement("span"))
.addClass("et2_checkbox_ro");
this.setDOMNode(this.span[0]);
},
set_value: function(_value) {
if(_value == this.selected_value) {
this.span.text(this.ro_true);
this.value = _value;
} else {
this.span.text(this.ro_false);
}
}
});
et2_register_widget(et2_checkbox_ro, ["checkbox_ro", "radio_ro"]);

View File

@ -0,0 +1,88 @@
/**
* eGroupWare eTemplate2 - JS Radiobox object
*
* @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
* @package etemplate
* @subpackage api
* @link http://www.egroupware.org
* @author Nathan Gray
* @copyright Nathan Gray 2011
* @version $Id$
*/
"use strict";
/*egw:uses
jquery.jquery;
et2_inputWidget;
*/
/**
* Class which implements the "radiobox" XET-Tag
*/
var et2_radiobox = et2_inputWidget.extend({
attributes: {
"set_value": {
"name": "Set value",
"type": "string",
"default": "true",
"description": "Value when selected"
},
"ro_true": {
"name": "Read only selected",
"type": "string",
"default": "x",
"description": "What should be displayed when readonly and selected"
},
"ro_false": {
"name": "Read only unselected",
"type": "string",
"default": "",
"description": "What should be displayed when readonly and not selected"
}
},
init: function(_parent) {
this._super.apply(this, arguments);
this.input = null;
this.id = "";
this.createInputWidget();
},
createInputWidget: function() {
this.input = $j(document.createElement("input")).attr("type", "radio");
this.input.addClass("et2_radiobox");
this.setDOMNode(this.input[0]);
},
/**
* Override default to match against set/unset value
*/
set_value: function(_value) {
if(_value != this.value) {
if(_value == this.set_value) {
this.input.attr("checked", "checked");
} else {
this.input.removeAttr("checked");
}
}
},
/**
* Override default to return unchecked value
*/
getValue: function() {
if(this.input.attr("checked")) {
return this.set_value;
}
}
});
et2_register_widget(et2_radiobox, ["radio"]);

View File

@ -22,6 +22,7 @@
et2_number; et2_number;
et2_selectbox; et2_selectbox;
et2_checkbox; et2_checkbox;
et2_radiobox;
et2_styles; et2_styles;
et2_html; et2_html;
et2_tabs; et2_tabs;

View File

@ -22,6 +22,7 @@
<script src="../et2_number.js"></script> <script src="../et2_number.js"></script>
<script src="../et2_selectbox.js"></script> <script src="../et2_selectbox.js"></script>
<script src="../et2_checkbox.js"></script> <script src="../et2_checkbox.js"></script>
<script src="../et2_radiobox.js"></script>
<script src="../et2_styles.js"></script> <script src="../et2_styles.js"></script>
<script src="../et2_html.js"></script> <script src="../et2_html.js"></script>