From 5e54d6b12b9758085d5124ab63acb3bc6b02595c Mon Sep 17 00:00:00 2001 From: Nathan Gray Date: Thu, 18 Aug 2011 17:34:01 +0000 Subject: [PATCH] Add basic radio, readonly version of checkbox/radio --- etemplate/js/et2_checkbox.js | 63 +++++++++++++++++++++-- etemplate/js/et2_radiobox.js | 88 +++++++++++++++++++++++++++++++++ etemplate/js/etemplate2.js | 1 + etemplate/js/test/test_xml.html | 1 + 4 files changed, 148 insertions(+), 5 deletions(-) create mode 100644 etemplate/js/et2_radiobox.js diff --git a/etemplate/js/et2_checkbox.js b/etemplate/js/et2_checkbox.js index 7e2dae93b9..50c719ad0f 100644 --- a/etemplate/js/et2_checkbox.js +++ b/etemplate/js/et2_checkbox.js @@ -15,6 +15,7 @@ /*egw:uses jquery.jquery; et2_inputWidget; + et2_valueWidget; */ /** @@ -23,17 +24,29 @@ var et2_checkbox = et2_inputWidget.extend({ attributes: { - "set_value": { + "selected_value": { "name": "Set value", "type": "string", "default": "true", "description": "Value when checked" }, - "unset_value": { + "unselected_value": { "name": "Unset value", "type": "string", "default": "false", "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) { if(_value != this.value) { - if(_value == this.set_value) { + if(_value == this.selected_value) { this.input.attr("checked", "checked"); } else { this.input.removeAttr("checked"); @@ -73,11 +86,51 @@ var et2_checkbox = et2_inputWidget.extend({ */ getValue: function() { if(this.input.attr("checked")) { - return this.set_value; + return this.selected_value; } else { - return this.unset_value; + return this.unselected_value; } } }); 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"]); diff --git a/etemplate/js/et2_radiobox.js b/etemplate/js/et2_radiobox.js new file mode 100644 index 0000000000..5c30187eff --- /dev/null +++ b/etemplate/js/et2_radiobox.js @@ -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"]); + diff --git a/etemplate/js/etemplate2.js b/etemplate/js/etemplate2.js index 515b57e23e..c30b5c7c77 100644 --- a/etemplate/js/etemplate2.js +++ b/etemplate/js/etemplate2.js @@ -22,6 +22,7 @@ et2_number; et2_selectbox; et2_checkbox; + et2_radiobox; et2_styles; et2_html; et2_tabs; diff --git a/etemplate/js/test/test_xml.html b/etemplate/js/test/test_xml.html index c3942367b0..b7fedc28b7 100644 --- a/etemplate/js/test/test_xml.html +++ b/etemplate/js/test/test_xml.html @@ -22,6 +22,7 @@ +