luci-base: cbi: rework ListValue and MultiValue templates

Signed-off-by: Jo-Philipp Wich <jow@openwrt.org>

2 files changed, 74 insertions, 27 deletions

diff --git a/modules/luci-base/luasrc/view/cbi/lvalue.htm b/modules/luci-base/luasrc/view/cbi/lvalue.htm
index ac63e9efd..61759fdd4 100644
--- a/modules/luci-base/luasrc/view/cbi/lvalue.htm
+++ b/modules/luci-base/luasrc/view/cbi/lvalue.htm
@@ -1,18 +1,42 @@
+<%
+	local i, key
+	local br = self.orientation == "horizontal" and '&#160;' or '<br />'
+%>
+
 <%+cbi/valueheader%>
 <% if self.widget == "select" then %>
-	<select class="cbi-input-select" data-update="change"<%= attr("id", cbid) .. attr("name", cbid) .. ifattr(self.size, "size") %>>
-	<% for i, key in pairs(self.keylist) do -%>
-		<option id="cbi-<%=self.config.."-"..section.."-"..self.option.."-"..key%>"<%= attr("value", key) .. ifattr(tostring(self:cfgvalue(section) or self.default) == key, "selected", "selected") .. attr("data-index", i) .. attr("data-depends", self:deplist2json(section, self.deplist[i])) %>><%=striptags(self.vallist[i])%></option>
-	<%- end %>
+	<select class="cbi-input-select" data-update="change"<%=
+		attr("id", cbid) ..
+		attr("name", cbid) ..
+		ifattr(self.size, "size")
+	%>>
+		<% for i, key in pairs(self.keylist) do -%>
+			<option<%=
+				attr("id", cbid.."-"..key) ..
+				attr("value", key) ..
+				attr("data-index", i) ..
+				attr("data-depends", self:deplist2json(section, self.deplist[i])) ..
+				ifattr(tostring(self:cfgvalue(section) or self.default) == key, "selected", "selected")
+			%>><%=pcdata(self.vallist[i])%></option>
+		<%- end %>
 	</select>
-<% elseif self.widget == "radio" then
-	local c = 0
-	for i, key in pairs(self.keylist) do
-	c = c + 1
-%>
-	<input class="cbi-input-radio" data-update="click change" type="radio"<%= attr("id", cbid.."-"..key) .. attr("name", cbid) .. attr("value", key) .. ifattr((self:cfgvalue(section) or self.default) == key, "checked", "checked") .. attr("data-index", i) .. attr("data-depends", self:deplist2json(section, self.deplist[i])) %> />
-	<label<%= attr("for", cbid.."-"..key) %>><%=self.vallist[i]%></label>
-<% if c == self.size then c = 0 %><% if self.orientation == "horizontal" then %>&#160;<% else %><br /><% end %>
-<% end end %>
+<% elseif self.widget == "radio" then %>
+	<div<%= attr("id", cbid) %>>
+		<% for i, key in pairs(self.keylist) do %>
+			<label<%=
+				attr("id", cbid.."-"..key) ..
+				attr("data-index", i) ..
+				attr("data-depends", self:deplist2json(section, self.deplist[i]))
+			%>>
+				<input class="cbi-input-radio" data-update="click change" type="radio"<%=
+					attr("name", cbid) ..
+					attr("value", key) ..
+					ifattr((self:cfgvalue(section) or self.default) == key, "checked", "checked")
+				%> />
+				<%=pcdata(self.vallist[i])%>
+			</label>
+			<% if i == self.size then write(br) end %>
+		<% end %>
+	</div>
 <% end %>
 <%+cbi/valuefooter%>
diff --git a/modules/luci-base/luasrc/view/cbi/mvalue.htm b/modules/luci-base/luasrc/view/cbi/mvalue.htm
index 79950cee2..ccdd6fcab 100644
--- a/modules/luci-base/luasrc/view/cbi/mvalue.htm
+++ b/modules/luci-base/luasrc/view/cbi/mvalue.htm
@@ -1,19 +1,42 @@
-<% local v = self:valuelist(section) or {} -%>
+<%
+	local i, key
+	local v = self:valuelist(section) or {}
+-%>
+
 <%+cbi/valueheader%>
 <% if self.widget == "select" then %>
-	<select class="cbi-input-select" multiple="multiple" data-update="click change"<%= attr("name", cbid) .. ifattr(self.size, "size") %>>
-	<% for i, key in pairs(self.keylist) do -%>
-		<option<%= attr("id", cbid.."-"..key) .. attr("value", key) .. ifattr(luci.util.contains(v, key), "selected", "selected") .. attr("data-index", i) .. attr("data-depends", self:deplist2json(section, self.deplist[i])) %>><%=striptags(self.vallist[i])%></option>
-	<%- end %>
+	<select class="cbi-input-select" multiple="multiple" data-update="click change"<%=
+		attr("id", cbid) ..
+		attr("name", cbid) ..
+		ifattr(self.size, "size")
+	%>>
+		<% for i, key in pairs(self.keylist) do -%>
+			<option<%=
+				attr("id", cbid.."-"..key) ..
+				attr("value", key) ..
+				attr("data-index", i) ..
+				attr("data-depends", self:deplist2json(section, self.deplist[i])) ..
+				ifattr(luci.util.contains(v, key), "selected", "selected")
+			%>><%=pcdata(self.vallist[i])%></option>
+		<%- end %>
 	</select>
-<% elseif self.widget == "checkbox" then
-	local c = 0;
-	for i, key in pairs(self.keylist) do
-	c = c + 1
-%>
-	<input class="cbi-input-checkbox" type="checkbox" data-update="click change"<%= attr("id", cbid.."-"..key) .. attr("name", cbid) .. attr("value", key) .. ifattr(luci.util.contains(v, key), "checked", "checked") .. attr("data-index", i) .. attr("data-depends", self:deplist2json(section, self.deplist[i])) %> />
-	<label<%= attr("for", cbid.."-"..key) %>><%=self.vallist[i]%></label><br />
-<% if c == self.size then c = 0 %><br />
-<% end end %>
+<% elseif self.widget == "checkbox" then %>
+	<div<%= attr("id", cbid) %>>
+		<% for i, key in pairs(self.keylist) do %>
+			<label<%=
+				attr("id", cbid.."-"..key) ..
+				attr("data-index", i) ..
+				attr("data-depends", self:deplist2json(section, self.deplist[i]))
+			%>>
+				<input class="cbi-input-checkbox" type="checkbox" data-update="click change"<%=
+					attr("name", cbid) ..
+					attr("value", key) ..
+					ifattr(luci.util.contains(v, key), "checked", "checked")
+				%> />
+				<%=pcdata(self.vallist[i])%>
+			</label>
+			<% if i == self.size then write('<br />') end %>
+		<% end %>
+	</div>
 <% end %>
 <%+cbi/valuefooter%>