luci-base: ui.js: fixes for radio widget type of select element

Signed-off-by: Jo-Philipp Wich <jo@mein.io>
(cherry picked from commit 2fb55e1ab5a28c1000a8de6710b6f586f5b88329)

diff --git a/modules/luci-base/htdocs/luci-static/resources/ui.js b/modules/luci-base/htdocs/luci-static/resources/ui.js
index b6201838e94c3efab2589c15b1563b4f609e34f5..72d447ec8d0a063c985b897a2980cd1d18d78af9 100644 (file)
--- a/modules/luci-base/htdocs/luci-static/resources/ui.js
+++ b/modules/luci-base/htdocs/luci-static/resources/ui.js
@@ -739,12 +739,14 @@ var UISelect = UIElement.extend(/** @lends LuCI.ui.Select.prototype */ {
                        }
                }
                else {
-                       var brEl = (this.options.orientation === 'horizontal') ? document.createTextNode(' ') : E('br');
+                       var brEl = (this.options.orientation === 'horizontal') ? document.createTextNode(' \xa0 ') : E('br');
 
                        for (var i = 0; i < keys.length; i++) {
-                               frameEl.appendChild(E('label', {}, [
+                               frameEl.appendChild(E('span', {
+                                       'class': 'cbi-%s'.format(this.options.multiple ? 'checkbox' : 'radio')
+                               }, [
                                        E('input', {
-                                               'id': this.options.id ? 'widget.' + this.options.id : null,
+                                               'id': this.options.id ? 'widget.%s.%d'.format(this.options.id, i) : null,
                                                'name': this.options.id || this.options.name,
                                                'type': this.options.multiple ? 'checkbox' : 'radio',
                                                'class': this.options.multiple ? 'cbi-input-checkbox' : 'cbi-input-radio',
@@ -752,11 +754,15 @@ var UISelect = UIElement.extend(/** @lends LuCI.ui.Select.prototype */ {
                                                'checked': (this.values.indexOf(keys[i]) > -1) ? '' : null,
                                                'disabled': this.options.disabled ? '' : null
                                        }),
-                                       this.choices[keys[i]] || keys[i]
+                                       E('label', { 'for': this.options.id ? 'widget.%s.%d'.format(this.options.id, i) : null }),
+                                       E('span', {
+                                               'click': function(ev) {
+                                                       ev.currentTarget.previousElementSibling.previousElementSibling.click();
+                                               }
+                                       }, [ this.choices[keys[i]] || keys[i] ])
                                ]));
 
-                               if (i + 1 == this.options.size)
-                                       frameEl.appendChild(brEl);
+                               frameEl.appendChild(brEl.cloneNode());
                        }
                }
 
@@ -789,7 +795,7 @@ var UISelect = UIElement.extend(/** @lends LuCI.ui.Select.prototype */ {
                if (this.options.widget == 'select')
                        return this.node.firstChild.value;
 
-               var radioEls = frameEl.querySelectorAll('input[type="radio"]');
+               var radioEls = this.node.querySelectorAll('input[type="radio"]');
                for (var i = 0; i < radioEls.length; i++)
                        if (radioEls[i].checked)
                                return radioEls[i].value;