diff options
| author | Jose Antonio Marquez | 2012-05-21 09:53:19 -0700 |
|---|---|---|
| committer | Jose Antonio Marquez | 2012-05-21 09:53:19 -0700 |
| commit | c087ca289bc6d6eb26d0f5543ec6d1df1ba5dd4e (patch) | |
| tree | 3d9b50fa845ba3d80fdc159275a9fece7ef69911 /js/components/radio.reel | |
| parent | b844fb34e9500560adcc8f9e860f7328f4db014f (diff) | |
| parent | 10471fc02fa75040baf337bc62ff683854793f81 (diff) | |
| download | ninja-c087ca289bc6d6eb26d0f5543ec6d1df1ba5dd4e.tar.gz | |
Merge branch 'refs/heads/Ninja-DOM-Architecture' into Document
Diffstat (limited to 'js/components/radio.reel')
| -rwxr-xr-x | js/components/radio.reel/radio.html | 9 | ||||
| -rwxr-xr-x | js/components/radio.reel/radio.js | 24 |
2 files changed, 22 insertions, 11 deletions
diff --git a/js/components/radio.reel/radio.html b/js/components/radio.reel/radio.html index 01b76b92..cee4c369 100755 --- a/js/components/radio.reel/radio.html +++ b/js/components/radio.reel/radio.html | |||
| @@ -11,13 +11,18 @@ | |||
| 11 | "owner": { | 11 | "owner": { |
| 12 | "prototype": "js/components/radio.reel", | 12 | "prototype": "js/components/radio.reel", |
| 13 | "properties": { | 13 | "properties": { |
| 14 | "element": {"#": "ch_comp"} | 14 | "element": {"#": "radio_comp"}, |
| 15 | "labelField": {"#": "labelField"}, | ||
| 16 | "radioField": {"#": "radioField"} | ||
| 15 | } | 17 | } |
| 16 | } | 18 | } |
| 17 | } | 19 | } |
| 18 | </script> | 20 | </script> |
| 19 | </head> | 21 | </head> |
| 20 | <body> | 22 | <body> |
| 21 | <input data-montage-id="ch_comp" class="nj-skinned" type="radio"> | 23 | <div data-montage-id="radio_comp"> |
| 24 | <input data-montage-id="radioField" class="nj-skinned" type="radio"> | ||
| 25 | <label data-montage-id="labelField" class="nj-skinned"></label> | ||
| 26 | </div> | ||
| 22 | </body> | 27 | </body> |
| 23 | </html> \ No newline at end of file | 28 | </html> \ No newline at end of file |
diff --git a/js/components/radio.reel/radio.js b/js/components/radio.reel/radio.js index c661ec11..cec4f52e 100755 --- a/js/components/radio.reel/radio.js +++ b/js/components/radio.reel/radio.js | |||
| @@ -62,7 +62,7 @@ exports.RadioGroup = Montage.create(Component, { | |||
| 62 | { | 62 | { |
| 63 | value:function(radio) | 63 | value:function(radio) |
| 64 | { | 64 | { |
| 65 | radio.element.setAttribute("name", this.name); | 65 | radio.radioField.setAttribute("name", this.name); |
| 66 | radio.addEventListener("change", this, false); | 66 | radio.addEventListener("change", this, false); |
| 67 | this.radios.push(radio); | 67 | this.radios.push(radio); |
| 68 | } | 68 | } |
| @@ -104,6 +104,14 @@ exports.Radio = Montage.create(Component, { | |||
| 104 | value: null | 104 | value: null |
| 105 | }, | 105 | }, |
| 106 | 106 | ||
| 107 | labelField: { | ||
| 108 | value: null | ||
| 109 | }, | ||
| 110 | |||
| 111 | radioField: { | ||
| 112 | value: null | ||
| 113 | }, | ||
| 114 | |||
| 107 | _checked: { | 115 | _checked: { |
| 108 | enumerable: false, | 116 | enumerable: false, |
| 109 | value: false | 117 | value: false |
| @@ -140,13 +148,13 @@ exports.Radio = Montage.create(Component, { | |||
| 140 | { | 148 | { |
| 141 | this._valueSyncedWithInputField = true; | 149 | this._valueSyncedWithInputField = true; |
| 142 | this._wasSetByCode = false; | 150 | this._wasSetByCode = false; |
| 143 | this.checked = this.element.checked; | 151 | this.checked = this.radioField.checked; |
| 144 | } | 152 | } |
| 145 | }, | 153 | }, |
| 146 | handleClick: { | 154 | handleClick: { |
| 147 | value: function() { | 155 | value: function() { |
| 148 | this._wasSetByCode = false; | 156 | this._wasSetByCode = false; |
| 149 | this.checked = !this.element.checked; | 157 | this.checked = !this.radioField.checked; |
| 150 | } | 158 | } |
| 151 | }, | 159 | }, |
| 152 | 160 | ||
| @@ -154,7 +162,7 @@ exports.Radio = Montage.create(Component, { | |||
| 154 | value: function() { | 162 | value: function() { |
| 155 | if(!this._valueSyncedWithInputField) | 163 | if(!this._valueSyncedWithInputField) |
| 156 | { | 164 | { |
| 157 | this.element.checked = this._checked; | 165 | this.radioField.checked = this._checked; |
| 158 | } | 166 | } |
| 159 | this._valueSyncedWithInputField = false; | 167 | this._valueSyncedWithInputField = false; |
| 160 | } | 168 | } |
| @@ -163,15 +171,13 @@ exports.Radio = Montage.create(Component, { | |||
| 163 | prepareForDraw: { | 171 | prepareForDraw: { |
| 164 | value: function() { | 172 | value: function() { |
| 165 | if (this.label !== null) { | 173 | if (this.label !== null) { |
| 166 | var b = document.createElement("label"); | 174 | this.labelField.innerHTML = this.label; |
| 167 | b.innerHTML = this.label; | ||
| 168 | this.element.appendChild(b); | ||
| 169 | b.addEventListener("click", this, false); | ||
| 170 | } | 175 | } |
| 176 | this.element.addEventListener("click", this, false); | ||
| 171 | if (this.group !== null) { | 177 | if (this.group !== null) { |
| 172 | this.group.addRadio(this); | 178 | this.group.addRadio(this); |
| 173 | } | 179 | } |
| 174 | this.element.addEventListener("change", this, false); | 180 | this.radioField.addEventListener("change", this, false); |
| 175 | } | 181 | } |
| 176 | } | 182 | } |
| 177 | 183 | ||