luci-app-firewall: align custom cbi teplates with new code

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

2 files changed, 23 insertions, 28 deletions

diff --git a/applications/luci-app-firewall/luasrc/view/firewall/cbi_addforward.htm b/applications/luci-app-firewall/luasrc/view/firewall/cbi_addforward.htm
index 3c46e228f7..4a5bcfd6fa 100644
--- a/applications/luci-app-firewall/luasrc/view/firewall/cbi_addforward.htm
+++ b/applications/luci-app-firewall/luasrc/view/firewall/cbi_addforward.htm
@@ -11,6 +11,12 @@
 			ezl[#ezl+1] = z
 		end
 	end
+
+	local keys, vals = { }, { }
+	luci.sys.net.ipv4_hints(function(ip, name)
+		keys[#keys+1] = ip
+		vals[#vals+1] = '%s (%s)' %{ ip, name }
+	end)
 -%>
 <div class="cbi-section-create cbi-tblsection-create">
 	<br />
@@ -46,7 +52,7 @@
 				</select>
 			</td>
 			<td class="cbi-section-table-cell" style="width:110px">
-				<input type="text" class="cbi-input-text" id="_newfwd.extport" name="_newfwd.extport" />
+				<input type="text" class="cbi-input-text" id="_newfwd.extport" name="_newfwd.extport" data-type="portrange" data-optional="true" />
 			</td>
 			<td class="cbi-section-table-cell" style="width:55px">
 				<select class="cbi-input-select" id="_newfwd.intzone" name="_newfwd.intzone">
@@ -54,10 +60,12 @@
 				</select>
 			</td>
 			<td class="cbi-section-table-cell" style="width:110px">
-				<input type="text" class="cbi-input-text" id="_newfwd.intaddr" name="_newfwd.intaddr" />
+				<input type="text" class="cbi-input-text" id="_newfwd.intaddr" name="_newfwd.intaddr" data-type="host" data-optional="true"<%=
+					ifattr(#keys > 0, "data-choices", luci.util.serialize_json({keys, vals}))
+				%>/>
 			</td>
 			<td class="cbi-section-table-cell" style="width:110px">
-				<input type="text" class="cbi-input-text" id="_newfwd.intport" name="_newfwd.intport" />
+				<input type="text" class="cbi-input-text" id="_newfwd.intport" name="_newfwd.intport" data-type="portrange" data-optional="true" />
 			</td>
 			<td class="cbi-section-table-cell">
 				<input type="submit" class="cbi-button cbi-button-add" name="cbi.cts.<%=self.config%>.<%=self.sectiontype%>.<%=section%>" value="<%:Add%>" />
@@ -66,15 +74,6 @@
 	</table>
 
 	<script type="text/javascript">//<![CDATA[
-		cbi_validate_field('_newfwd.extport', true, 'portrange');
-		cbi_validate_field('_newfwd.intaddr', true, 'host');
-		cbi_validate_field('_newfwd.intport', true, 'portrange');
-
-		cbi_combobox_init('_newfwd.intaddr', {
-			<% first = true; luci.sys.net.ipv4_hints(function(ip, name) %>
-				<%- if first then first = false else %>,<% end -%>'<%=ip%>': '<%=ip%> (<%=name%>)'
-			<%- end) %> }, '', '<%: -- custom -- %>');
-
 		cbi_bind(document.getElementById('_newfwd.extport'), 'blur',
 			function() {
 				var n = document.getElementById('_newfwd.name');
@@ -109,8 +108,5 @@
 					}
 				}
 			});
-
-
-		cbi_validate_field('cbi.cts.<%=self.config%>.<%=self.sectiontype%>.<%=section%>', true, 'uciname');
 	//]]></script>
 </div>
diff --git a/applications/luci-app-firewall/luasrc/view/firewall/cbi_addsnat.htm b/applications/luci-app-firewall/luasrc/view/firewall/cbi_addsnat.htm
index 4e1681c11d..817c046c8c 100644
--- a/applications/luci-app-firewall/luasrc/view/firewall/cbi_addsnat.htm
+++ b/applications/luci-app-firewall/luasrc/view/firewall/cbi_addsnat.htm
@@ -3,6 +3,14 @@
 	local nw = require "luci.model.network".init()
 	local wz = fw:get_zone("wan")
 	local lz = fw:get_zone("lan")
+
+	local keys, vals, a, k, v = {}, {}
+	for k, v in ipairs(nw:get_interfaces()) do
+		for k, a in ipairs(v:ipaddrs()) do
+			keys[#keys+1] = a:host():string()
+			vals[#vals+1] = '%s (%s)' %{ a:host(), v:shortname() }
+		end
+	end
 %>
 
 <div class="cbi-section-create cbi-tblsection-create">
@@ -39,27 +47,18 @@
 					</select>
 				</td>
 				<td class="cbi-section-table-cell" style="width:110px">
-					<input type="text" class="cbi-input-text" id="_newsnat.dip" name="_newsnat.dip" />
+					<input type="text" class="cbi-input-text" id="_newsnat.dip" name="_newsnat.dip" placeholder="<%:Do not rewrite%>" data-type="ip4addr" data-optional="true"<%=
+						ifattr(#keys > 0, "data-choices", luci.util.serialize_json({ keys, vals }))
+					%> />
 				</td>
 				<td class="cbi-section-table-cell" style="width:110px">
-					<input type="text" class="cbi-input-text" id="_newsnat.dport" name="_newsnat.dport" placeholder="<%:Do not rewrite%>" />
+					<input type="text" class="cbi-input-text" id="_newsnat.dport" name="_newsnat.dport" placeholder="<%:Do not rewrite%>" data-type="portrange" data-optional="true" />
 				</td>
 				<td class="cbi-section-table-cell">
 					<input type="submit" class="cbi-button cbi-button-link" name="_newsnat.submit" value="<%:Add and edit...%>" />
 				</td>
 			</tr>
 		</table>
-
-		<script type="text/javascript">//<![CDATA[
-			cbi_validate_field('_newsnat.dport', true, 'portrange');
-			cbi_validate_field('_newsnat.dip', true, 'ip4addr');
-			cbi_combobox_init('_newsnat.dip', {
-				<% local c, k, v = 0; for k, v in ipairs(nw:get_interfaces()) do -%>
-					<%- local a; for k, a in ipairs(v:ipaddrs()) do c = c + 1 -%>
-						<% if c > 1 then %>,<% end %>'<%=a:host():string()%>': '<%=a:host():string()%> (<%=v:shortname()%>)'
-					<%- end %>
-				<%- end %> }, '<%: -- Please choose -- %>', '<%: -- custom -- %>');
-		//]]></script>
 	<% else %>
 		<input type="submit" class="cbi-button cbi-button-add" name="cbi.cts.<%=self.config%>.<%=self.sectiontype%>.<%=section%>" value="<%:Add%>" />
 	<% end %>