別のcomboxから選択した後にコンボボックスを塗りつぶす

Question

私は2つのコンボボックスを持っています。最初のコンボボックスはデータベースから塗りつぶされ、その後(onchange)のオプションを選択すると、2番目のコンボボックスが塗りつぶされます。複数の値がありますが、最初のコンボボックスにオプションが1つしかない場合は機能しません。なぜこのようなことが起こるのか誰でも助けてくれますか？

<div> 
    <label class="arrow-right"> Category Name</label><br> 
    <select class="SelectStyle" style="width:95%;border:0;" name="CategoryName" id="CategoryName" onchange="GetOrderProduct(this.options[this.selectedIndex].innerHTML)"> 
     <option value="">Select Category Name</option> 
    </select> 
</div> 
<div> 
    <label class="arrow-right"> Category Type</label> 
</div> 
<div> 
    <select class="SelectStyle" style="width:95%;border:0;" name="CategoryType" id="CategoryType" > 
     <option value="">Select Category Type</option> 
    </select> 
</div> 

Javascriptコード：

function GetOrderProduct(val) 
{ 
    var sel=document.getElementById("OrderId"); 
    var OrdID = sel.options[sel.selectedIndex].text; 

    $.ajax({ 
     type:"POST", 
     url:"get_OrderProducts.php", 
     data:{ 
      'CatName': val, 
      'OrderID':OrdID 
     }, 
     success: function(data){ 

      $("#CategoryType").html(data); 
     } 
    }) 
} 

Answer 1

ドロップダウンリストで唯一のオプションを使用して、あなたが選択した項目を変更することはできません、これはあるので、onchangeイベントが発火することはありません。 イベントとchangeイベントを持つように要素を設定できますが、これはおそらく迷惑になり、パフォーマンスの遅延を招きます。

一番下の行は要素が1つのみであるため、別のときに別の方法でコードをトリガーする必要があります。