1

メイン カテゴリ用とサブ カテゴリ用の 2 つのコンボ ボックスがあります。ここで、値がデータベースから取得されるメイン カテゴリをユーザーに選択してもらい、その特定のカテゴリに基づいて、サブカテゴリ (db から) を 2 番目のコンボ ボックスに表示する必要があります。

以下に示すように、Javaスクリプトを使用してみました:

     <script>
       function byId(e) {return document.getElementById(e);}

       function stateComboChange()
      {
  var combo1 = byId('stateCombo');  //main category combo id
  var combo2 = byId('cityCombo');    //sub category combo id
  //  alert(combo1.value);

  emptyCombo(combo2);
  switch(combo1.value)
  {
    case '-1':  addOption(combo2, -1, '-select state first-');
                break;
    case '0':   addOption(combo2,'Nokia');
                addOption(combo2, 'Samsung');
                addOption(combo2, 'Sony');
                addOption(combo2, 'Iphone 5');
                addOption(combo2, 'Lava');
                addOption(combo2, 'Micromax');

                break;
    case '1':   addOption(combo2, 'Edge Router');
                addOption(combo2, 'Subscriber Edge Router');
                addOption(combo2, 'Inter-provider Border Router');
                addOption(combo2, 'Core Router');
                addOption(combo2, 'Wired and Wireless Routers');

                break;
    case '2':       addOption(combo2, 'MTS');
                addOption(combo2, 'Docomo');
                addOption(combo2, 'Airtel');
                addOption(combo2, 'Photon');
                addOption(combo2, 'Idea');
                addOption(combo2, 'Vodafone');

                break;


}
cityComboChange();

//  var Cat = document.getElementById('stateCombo').value;
    document.getElementById('catvalue').value = combo1.value;

}

       function emptyCombo(e)
      {
         e.innerHTML = '';
      }

ここで、この追加オプション機能を実装する方法を知る必要があります。これにより、db からの値がその 2 番目のコンボ ボックスに表示されます。現在、これは手動です。

       function addOption(combo, txt)
         {
      var option = document.createElement('option');
      option.value = txt;
        option.title = txt;
       option.appendChild(document.createTextNode(txt));
         combo.appendChild(option);
           }

        </script>

または、誰でもこれに対する最善の解決策を提案できますか。

4

0 に答える 0