複数の異なる出力を持つ1つのドロップダウンメニュー

Question

私はちょっとした挑戦をしています。
入力値から2つまたは3つの定義済み出力を取得しようとしています。
コードは以下の通りですが、私が働くために必要なのは、ball_1、ball_2、ball_3、またはball_4を選択することです.VLANとIPは異なります。出力VLAN 12とIP 32に必要しかしball_2 ball_3用としてVLAN 22とIP 33であることが必要とball_4 VLANを空のままに必要ball_1
..

function showData() { 
 
     var theSelect = demoForm.demoSelect; 
 
     var firstP = document.getElementById('firstP'); 
 
     var secondP = document.getElementById('secondP'); 
 
     var thirdP = document.getElementById('thirdP'); 
 
     firstP.innerHTML = (theSelect.selectedIndex); 
 
     secondP.innerHTML = (theSelect[theSelect.selectedIndex].value) - (10); 
 
     thirdP.innerHTML = (theSelect[theSelect.selectedIndex].value); 
 
    }

<form name="demoForm"> 
 
    <select name="demoSelect" onchange="showData()"> 
 
    <option value="zilch">Select:</option> 
 
    <option value="32">ball_1</option> 
 
    <option value="33">ball_2</option> 
 
    <option value="84">ball_3</option> 
 
    <option value="85">ball_4</option> 
 
    </select> 
 
</form> 
 
<table class=table2> 
 
    <tr> 
 
    <td>bla</td> 
 
    <td>VLAN</td> 
 
    <td>IP</td> 
 
    </tr> 
 
    <tr> 
 
    <td> 
 
     <p id="firstP">&nbsp;</p> 
 
    </td> 
 
    <td> 
 
     <p id="secondP">&nbsp;</p> 
 
    </td> 
 
    <td> 
 
     <p id="thirdP">&nbsp;</p> 
 
    </td> 
 
    </tr> 
 
</table>

BLAは今のために使用されていませんそれはそれほど重要ではありません。

私はまた、より良い自分のニーズを満たすように思われるコードのこのビットを見つけたが、それは、多かれ少なかれ正しい値を出力して、私は、入力値を実行するために、ドロップダウンメニューを取得することはできません

<form 
 
    oninput="x.value=parseInt(a.value)*parseInt(300);y.value=parseInt(a.value)*parseInt(400);"> 
 
     <table style="text-align: left; width: 100px;" border="1" 
 
     cellpadding="2" cellspacing="2"> 
 
     <tbody> 
 
       <tr> 
 
        <td><input name="a" value="" type="text"></td> 
 
       </tr> 
 
       <tr> 
 
        <td><output name="x" for="a b"></td> 
 
       </tr> 
 
       <tr> 
 
        <td><output name="y" for="a b"></td> 
 
       </tr> 
 
      </tbody> 
 
     </table> 
 
    </form>

私はhmtlとjavaについていくつかの基本的な知識を持っていますが、私はそれが正しく動作するようにすることはできませんか、それは不可能ですか？事前に

おかげで
種類は
はWouter

PSについて。私はデータベースを使用せず、SQL Serverを実行することはほとんど不可能です。

Answer 1

選択した値を正しくドロップダウンしていないため、作業コードの下を見てください。

Javascriptのドロップダウン選択した値にアクセスし、IPを設定する機能やVLAN

function showData() { 

     var ddlDemo = document.getElementById("ddlDemoSelect"); 
     var selectedValue = ddlDemo.options[ddlDemo.selectedIndex].value; 

     if (selectedValue == 32) { 
      document.getElementById('firstP').innerText = "bla"; 
      document.getElementById('secondP').innerText = "12"; 
      document.getElementById('thirdP').innerText = "32"; 
     } 
     else if (selectedValue == 33) { 
      document.getElementById('firstP').innerText = "bla"; 
      document.getElementById('secondP').innerText = "22"; 
      document.getElementById('thirdP').innerText = "33"; 
     } 
     else { 
      document.getElementById('firstP').innerText = ""; 
      document.getElementById('secondP').innerText = ""; 
      document.getElementById('thirdP').innerText = ""; 
     } 
    } 

Htmlの。私は後でそれにアクセスするためにドロップダウンのIDを追加しました。

<form name="demoForm"> 
    <select id="ddlDemoSelect" name="demoSelect" onchange="showData()"> 
     <option value="zilch">Select:</option> 
     <option value="32">ball_1</option> 
     <option value="33">ball_2</option> 
     <option value="84">ball_3</option> 
     <option value="85">ball_4</option> 
    </select> 
    </form> 


<table class=table2> 
<tr> 
    <td>bla</td> 
    <td>VLAN</td> 
    <td>IP</td> 
</tr> 
<tr> 
    <td> 
    <p id="firstP">&nbsp;</p> 
    </td> 
    <td> 
    <p id="secondP">&nbsp;</p> 
    </td> 
    <td> 
    <p id="thirdP">&nbsp;</p> 
    </td> 
    </tr> 
</table>