Add VLAN selector dropdown to VLAN configuration page

A new <select> element above the VLAN ID input lets users pick an
existing VLAN by name instead of typing the ID. Options are loaded
from /vlanlist on page load and re-loaded after successful
Update/Create operations.

Selection triggers the existing fetchVLAN() flow.

Falls back gracefully if /vlanlist returns an empty list or fails:
the dropdown is hidden and the existing ID input remains functional.

html/vlan.html

@@ -10,6 +10,13 @@
     <div id="ports"></div>
     <h1>VLAN Configuration</h1>
     <form id="vform" action="/vlan.html">
+      <div>
+        <label for="vlanSelect">VLAN auswählen:</label>
+        <select id="vlanSelect" style="margin: 0 0 0 8px">
+          <option value="" disabled selected>— VLAN wählen —</option>
+        </select>
+      </div>
+      <br/>
       <div>
         <label for="vid">VLAN ID:</label>
         <input type="number" min="1" max="4094" id="vid" name="vid">

html/vlan.js

@@ -83,9 +83,40 @@ function fetchVLAN() {
   sendXHTTP(xhttp);
 }
 
+function loadVlanList() {
+  var xhttp = new XMLHttpRequest();
+  xhttp.onreadystatechange = function() {
+    if (this.readyState !== 4) return;
+    var sel = document.getElementById('vlanSelect');
+    if (this.status !== 200) {
+      sel.style.display = 'none';
+      return;
+    }
+    var vlans = JSON.parse(this.responseText);
+    if (!vlans.length) {
+      sel.style.display = 'none';
+      return;
+    }
+    sel.options.length = 1;
+    for (var i = 0; i < vlans.length; i++) {
+      var opt = document.createElement('option');
+      opt.value = vlans[i].id;
+      opt.text = vlans[i].name ? vlans[i].id + ' — ' + vlans[i].name : String(vlans[i].id);
+      sel.appendChild(opt);
+    }
+  };
+  xhttp.open('GET', '/vlanlist', true);
+  sendXHTTP(xhttp);
+}
+
 window.addEventListener("load", function() {
   update( () => {
     vlanForm();
+    loadVlanList();
+    document.getElementById('vlanSelect').onchange = function() {
+      document.getElementById('vid').value = this.value;
+      fetchVLAN();
+    };
     const interval = setInterval(update, 2000);
   });
 });

html/vlan_sub.js

@@ -28,6 +28,7 @@ async function vlanSub() {
       });
       console.log('Completed!', response);
     }
+    loadVlanList();
   } catch(err) {
     console.error(`Error: ${err}`);
   }