選択したオプション値で入力値を設定します

Question

私がしようとしているのは、オプションフィールドの順序のように名前を並べることによって、selctedオプションによって入力フィールドに設定されるkabelnameを設定することです。

これは、オプションを選択または選択解除し、入力ファイル全体を上書きすることによって行われます。選択したオプションの値の追加または削除のみが必要です。

keckelartが選択され、steckertyp1の場合、steckertyp1の値はkabelartの値に " - "を付けてkabelnameの入力フィールドに追加する必要があります。

Verwendungが選択されている場合、それはkabelnameに "。"と値。それ以外の場合はVerwendungが選択されていますが、Steckertypはそうではありません。それはkabelnameに " - "を付け加える必要があります。 kabelartがsettedされている場合は

同じことがAnschlusstypで発生shoul ...

は ""、そしてkabelnameはクリアする必要があります。しかし、他のオプションのうちの1つが変更されたり、 ""に設定されていれば、その位置でのみ削除する必要があります。

その悪い記述で申し訳ありませんが、私はあなたが私の言いたいことを知って欲しいと思います。気にしないでください。

は一つだけを使用し、

function changedKabelart(kabelartValue){ 
 
    var kaValue = kabelartValue; 
 
    
 
    if(kaValue != ""){  
 
    document.getElementById("kabelname").value = kaValue; 
 
    } 
 
    else{ 
 
    document.getElementById("kabelname").value = kaValue;  
 
    } 
 
} 
 

 
/* Steckertyp 1 */ 
 
function changedSteckertyp1(sttyp1Value){ 
 
    var st1Value = sttyp1Value; 
 
    
 
    if(st1Value != ""){ 
 
    document.getElementById("kabelname").value += "-" + st1Value; 
 
    } 
 
    else{   
 
    document.getElementById("kabelname").value += st1Value; 
 
    }   
 
} 
 

 
/* Verwendung */ 
 
function changedVerwendung(verwendungValue){ 
 
    var vwValue = verwendungValue; 
 
    var st1Value = document.getElementById("steckertyp1").value; 
 
    
 
    
 
    if(vwValue != "" && st1Value != ""){ 
 
    document.getElementById("kabelname").value += "." + vwValue; 
 
    } 
 
    else if(vwValue != "" && st1Value == ""){ 
 
    document.getElementById("kabelname").value += "-" + vwValue; 
 
    } 
 
    else{   
 
    document.getElementById("kabelname").value += vwValue; 
 
    }   
 
} 
 
     
 
/* Anschlusstyp 1 */ 
 
function changedAnschluss1(anschluss1Value){ 
 
    var ansch1Value = anschluss1Value; 
 
    
 
    if(ansch1Value != ""){ 
 
    document.getElementById("kabelname").value += "-" + ansch1Value; 
 
    } 
 
    else{    
 
    document.getElementById("kabelname").value += ansch1Value; 
 
    }   
 
}

<p> Kabelart </p> 
 
<select name="kabelart" id="kabelart" required onchange="changedKabelart(this.value);"> 
 
    <option value="" selected></option> 
 
    <option value="K" > Kabel</option> 
 
    <option value="K2" > Kabel 2</option> 
 
    <option value="K3" > Kabel 3</option> 
 
</select> 
 

 
<p> Steckertyp </p> 
 
<select name="steckertyp1" id="steckertyp1" onchange="changedSteckertyp1(this.value);"> 
 
    <option value="" selected></option> 
 
    <option value="ST1" >ST1</option> 
 
    <option value="ST2" >ST2</option> 
 
    <option value="ST3" >ST3</option> 
 
</select> 
 

 
<p> Verwendung </p> 
 
<select name="verwendung" id="verwendung" onchange="changedVerwendung(this.value);" > 
 
    <option value="" selected></option> 
 
    <option value="VW1" >VW1</option> 
 
    <option value="VW2" >VW1</option> 
 
</select> 
 

 
<p> Anschlusstyp </p> 
 
<select name="anschlusstyp1" id="anschlusstyp1" onchange="changedAnschluss1(this.value);" > 
 
    <option value="" selected></option> 
 
    <option value="A1" >A1</option> 
 
    <option value="A2" >A2</option> 
 
    <option value="A3" >A3</option> 
 
</select> 
 

 
<br><br><br> 
 
<input type="text" name="kabelname" id="kabelname" placeholder="Kabelname" readonly />

Answer 1

代わりのkabelnameを更新するために、さまざまな機能を使用していただきありがとうございます。その後、すべてがカバーされます。

  <p> Kabelart </p> 
     <select name="kabelart" id="kabelart" required onchange="update();"> 
      <option value="" selected></option> 
      <option value="K" > Kabel</option> 
      <option value="K2" > Kabel 2</option> 
      <option value="K3" > Kabel 3</option> 
     </select> 

     <p> Steckertyp </p> 
     <select name="steckertyp1" id="steckertyp1" onchange="update();"> 
      <option value="" selected></option> 
      <option value="ST1" >ST1</option> 
      <option value="ST2" >ST2</option> 
      <option value="ST3" >ST3</option> 
     </select> 

     <p> Verwendung </p> 
     <select name="verwendung" id="verwendung" onchange="update();" > 
      <option value="" selected></option> 
      <option value="VW1" >VW1</option> 
      <option value="VW2" >VW1</option> 
     </select> 

     <p> Anschlusstyp </p> 
     <select name="anschlusstyp1" id="anschlusstyp1" onchange="update();" > 
      <option value="" selected></option> 
      <option value="A1" >A1</option> 
      <option value="A2" >A2</option> 
      <option value="A3" >A3</option> 
     </select> 

     <br><br><br> 
     <input type="text" name="kabelname" id="kabelname" placeholder="Kabelname" readonly /> 


     <script> 
     function update() { 
      var kabelname ; 
      if(document.getElementById("kabelart").value === "") { 
       kabelname = ""; 
      } 
      else { 
       kabelname = document.getElementById("kabelart").value; 

       if(document.getElementById("steckertyp1").value!== ""){ 
        kabelname += "-" + document.getElementById("steckertyp1").value; 
        if(document.getElementById("verwendung").value !== "") { 
         kabelname += "." + document.getElementById("verwendung").value; 
         if(document.getElementById("anschlusstyp1").value!== "") { 
          kabelname += "-" + document.getElementById("anschlusstyp1").value; 
         } 
        } 
        else { 
         if(document.getElementById("anschlusstyp1").value!== "") { 
          kabelname += "." + document.getElementById("anschlusstyp1").value; 
         }  
        } 
       } 
       else { 
        if(document.getElementById("verwendung").value !== "") { 
         kabelname += "-" + document.getElementById("verwendung").value; 
         if(document.getElementById("anschlusstyp1").value!== "") { 
          kabelname += "." + document.getElementById("anschlusstyp1").value; 
         } 
        } 
        else { 
         if(document.getElementById("anschlusstyp1").value!== "") { 
          kabelname += "-" + document.getElementById("anschlusstyp1").value; 
         }        
        } 
       } 

      }     
      document.getElementById("kabelname").value = kabelname;     
     } 

     </script>