0

ここで起こる奇妙な事態。私はjqueryプラグインのchoose.jsを使用しています。ページに既にあるドロップダウンを ajax 呼び出しと jquery で更新しています。ここにサンプルコードの一部を示します。ページに示されているように、ここに私のドロップダウンがあります。

<div id="singleDropDownBlock" style="display: none">

    <select id="SingleDropDown"  class="chzn-select" data-placeholder="Choose your start Location" onchange="GetFromNodeValue();">
        <!--<option>select a strating locnation based on category.</option>-->

    </select>

</div>

これは、jquery を使用してドロップダウンに値をロードするコードです。

     function GetResultsFromMultiCategory(data)
     {


             for (i = 0; i < data.d.categories.length; i++)
             {
                 //console.log(data.d.categories[i].catNode);

                 if (data.d.categories[i].catNode == "0")
                 {

                     $('#SingleDropDown').append("<optgroup " + "label= " + '"' + data.d.categories[i].catName + '"' + ">");
                     console.log("<optgroup " + "label= " + '"' + data.d.categories[i].catName + '"' + ">");
                     //onOrOff = false;  </optgroup>
                 }
                 else
                 {
                     $('#SingleDropDown').append("<option " + "value=" + data.d.categories[i].catNode+ ">" + data.d.categories[i].catLoc + "</option>");
                     console.log("<option " + "value='" + data.d.categories[i].catNode + "'>" + data.d.categories[i].catLoc + "</option>");

                     if (typeof(data.d.categories[i + 1]) != "undefined")
                     {

                         if (data.d.categories[i + 1].catNode == "0")
                         {
                             $('#SingleDropDown').append("</optgroup>");
                             console.log("</optgroup>");

                         }//end second if
                     }//end first if
                 }//end else

             }

             $('#SingleDropDown').append("</optgroup>");
             console.log("</optgroup>");
             $("#SingleDropDown").chosen({ placeholder_text_single: "Choose Map" });
             $("#SingleDropDown").trigger("chosen:updated");
      }

何らかの理由で、選択されたのみで更新されます. 足りないものはありますか？誰かが私を正しい方向に向けてください。また、プレースホルダーを更新するために選択することもできません。私が得るのは、ディスプレイとしてリストの最初の項目だけです。

あなたが提供できる助けを前もって感謝します。

4

1 に答える 1

0

私はついに私の問題を理解しました。いつか他の誰かに役立つように、ここに回答を投稿します。

ここでの問題は、一度に 1 つの選択を追加すると、ブラウザーによって閉じられていたことです。したがって、これを行う最良の方法は次のとおりです。

function GetResultsFromMultiCategory(data)
         {
             $("#singleDropDownBlock").show();

             $('#SingleDropDown').append("<option></option>");

             var myOptions = '';
             for (i = 0; i < data.d.categories.length; i++)
             {    
                 if (data.d.categories[i].catNode == "0")
                 {
                     myOptions += "<optgroup " + "label= " + '"' + data.d.categories[i].catName + '"' + ">";
                 }
                 else
                 {
                     myOptions += "<option " + "value=" + data.d.categories[i].catNode + ">" + data.d.categories[i].catLoc + "</option>";

                     if (typeof(data.d.categories[i + 1]) != "undefined")
                     {
                         if (data.d.categories[i + 1].catNode == "0")
                         {
                             myOptions += "</optgroup>";
                         }
                     }
                 }    
             }
             myOptions += "</optgroup>";
             $('#SingleDropDown').append(myOptions);
             $("#SingleDropDown").chosen({placeholder_text_single: "Choose Start Location" });
         }

ここでのポイントは、各行を追加する代わりに追加を使用する場合、文字列を作成してから html 要素に追加することです。

于 2013-09-12T13:36:19.277 に答える