123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155 |
- <!DOCTYPE html>
- <html>
- <head>
- <meta charset="utf-8">
- <title>WDKL NET BRIDGE</title>
- </head>
- <style>
- fieldset{
- margin-top: 30px;
- border-radius: 15px;
- border: 1px solid #ccc;
- }
- label{
- display: inline-block;
- width: 100px;
- text-align: right;
- margin-right: 30px;
- }
- input{
- margin-top: 10px;
- }
- input[type=submit] {
- margin-left: 10%;
- width: 200px;
- background-color: #4CAF50;
- color: white;
- padding: 14px 20px;
- margin: 8px 0;
- border: none;
- border-radius: 4px;
- cursor: pointer;
- }
- input[type=submit]:hover {
- background-color: #45a049;
- }
- </style>
- <body>
- <div>
- <h1>WDKL NET BRIDGE</h1>
- <p>mac : %s</p>
- </div>
- <form action="/setting" method="POST" onsubmit="return validate();">
- <fieldset>
- <legend>DEVICE</legend>
- <label>DHCP?</label>
- YES<input onclick="ipSetting(false);" type="radio" name="dhcp" value="1" style="margin-right: 1rem;" checked>
- NO<input onclick="ipSetting(true);" type="radio" name="dhcp" value="0">
- <br>
- <div id="ip_panel" style="display: none;">
- <label>IP</label>
- <input type="text" name="ip" id="ip" value="%s">
- <br>
- <label>NETMASK</label>
- <input type="text" name="netmask" id="netmask" value="%s">
- <br>
- <label>GATEWAY</label>
- <input type="text" name="gateway" id="gateway" value="%s">
- <br>
- <label>DNS1</label>
- <input type="text" name="dns1" id="dns1" value="%s">
- <br>
- <label>DNS2</label>
- <input type="text" name="dns2" id="dns2" value="%s">
- </div>
- </fieldset>
- <fieldset>
- <legend>SERVER</legend>
- <label>SERVER IP</label>
- <input type="text" name="server_ip" id="server_ip" value="%s">
- </fieldset>
-
- <input type="submit" value="submit">
- </form>
- <script>
- function ipSetting(show){
- console.log("xxx" + show);
- document.getElementById("ip_panel").style.display = show?"block":"none";
- }
- function validate() {
- console.log(document.getElementById("ip_panel").style.display);
- var regexIP = /^((25[0-5]|2[0-4][0-9]|1[0-9][0-9]|[1-9][0-9]|[0-9]).){3}(25[0-5]|2[0-4][0-9]|1[0-9][0-9]|[1-9][0-9]|[0-9])$/;
- var regexNetmask = /^(254|252|248|240|224|192|128|0)\.0\.0\.0|255\.(254|252|248|240|224|192|128|0)\.0\.0|255\.255\.(254|252|248|240|224|192|128|0)\.0|255\.255\.255\.(254|252|248|240|224|192|128|0)$/;
- var ip = document.getElementById("ip").value;
- var netmask = document.getElementById("netmask").value;
- var gateway = document.getElementById("gateway").value;
- var dns1 = document.getElementById("dns1").value;
- var dns2 = document.getElementById("dns2").value;
- var server_ip = document.getElementById("server_ip").value;
- if (document.getElementById("ip_panel").style.display == "none"){
- if (server_ip == ""){
- alert("server ip must input");
- document.getElementById("server_ip").focus();
- return false;
- } else if (!regexIP.test(server_ip)){
- alert("server ip wrong input");
- document.getElementById("server_ip").focus();
- return false;
- }
- return true;
- } else {
- if (ip == ""){
- alert("ip must input");
- document.getElementById("ip").focus();
- return false;
- } else if (netmask == ""){
- alert("netmask must input");
- document.getElementById("netmask").focus();
- return false;
- } else if (gateway == ""){
- alert("gateway must input");
- document.getElementById("gateway").focus();
- return false;
- } else if (server_ip == ""){
- alert("server_ip must input");
- document.getElementById("server_ip").focus();
- return false;
- }
- if (!regexIP.test(ip)){
- alert("ip wrong input");
- document.getElementById("ip").focus();
- return false;
- } else if (!regexNetmask.test(netmask)){
- alert("netmask wrong input");
- document.getElementById("netmask").focus();
- return false;
- } else if (!regexIP.test(gateway)){
- alert("gateway wrong input");
- document.getElementById("gateway").focus();
- return false;
- } else if (!regexIP.test(server_ip)){
- alert("server_ip wrong input");
- document.getElementById("server_ip").focus();
- return false;
- } else if (dns1!="" && !regexIP.test(dns1)){
- alert("dns1 wrong input");
- document.getElementById("dns1").focus();
- return false;
- } else if (dns2!="" && !regexIP.test(dns2)){
- alert("dns2 wrong input");
- document.getElementById("dns2").focus();
- return false;
- }
- return true;
- }
- }
- </script>
- </body>
- </html>
|