jQueryでselectを生成するにはget、次にselectの値を設定しますか？

Question

私はjQueryのget関数を使ってselect（CFコンポーネントのSQLクエリの結果に基づいて）を生成しようとしています。ポピュレーションはうまく動作しますが、セレクトがポピュレートされた後に正しいオプションを選択したいと思います。 done（）を使って試しましたが、うまくいかないようです。例コード：

function fChangeSelect() { 
    var txOutcomeSelect = ('#someSelect'); 
    $.get("#request.webroot#cfc/assessment.cfc?method=getEncCatChildrenRemote&encCatIdList=" + encCatIdList, 
        function(jsonText){ 
         var qryTxOutcomes = JSON.parse(jsonText); 

         //qryTxOutcomes is now an object with 2 arrays: COLUMNS and DATA. 
         //COLUMNS is an array of strings of the column names. 
         //DATA is an array of arrays, where each array is a row. 
         //Thus, every data cell is DATA[rownumber][columnnumber] 


         txOutcomeSelect.empty(); 
         txOutcomeSelect.append('<option value="">--Select an Outcome--</option>'); 
         $.each(qryTxOutcomes.DATA, function() { 
          txOutcomeSelect.append('<option value=' + $(this)[5] + '>' + $(this)[3] + '</option>'); 
         }); 
        } 
    ).done(function(){ 
     txOutcomeSelect.val('123');//does nothing, because select isn't populated yet. 
     alert('txOutcomeSelect should be populated by now, but its not. It only populated after I click OK on this alert.'); 
    }); 
} 

（更新）明らかに、それはajaxのタイミングとは関係ありません。テストのために、私は選択肢の数のオプションでアラートを表示するボタンを入れました。私は、ページが読み込まれるのを待って、選択が設定され、ボタンをクリックし、警告が "0"に戻りました。したがって、selectにappend（）が設定されていて、そのオプションが画面に表示されていても、jQueryはselectが空であると考えています。

Answer 1

これは、jQuery以外のget、私はselect/select-option-after-ajax-runs機能が動作するようにclear/populate/selectオプションを使用する必要がありました。

最終的にdone（）を使用して、ajaxの実行後に適切なオプションが選択されるようにしなければなりませんでした。また、ページが読み込まれたときとマスター選択が変更されたときの両方でこの関数が呼び出されるため、ページリロードのために関数が呼び出されているかどうかを示すために追加の引数を渡す必要がありました。ページが読み込まれると、selectは別の "master" selectの値に基づいて設定され、選択したオプションをDBから取得したものと一致させたい。マスター選択が変更されたら、「サブ」セレクトのオプションを変更したいが、どのオプションもあらかじめ選択したくない。

私の機能は以下のようになりました。少しラウンドアバウト。私はjQueryがこれを不要にするように更新されていないことに驚いています。

 //Using ajax to populate Treatment Outcome selects, based on selected Assessment Outcome 

     function fChangeTxOutcome(sel, bLoading) { 
      var id = sel.prop('id'); 
      var idNum = id[id.length-1]; 
      var txOutcomeSelect = document.getElementById('txOutcomeSelect' + idNum); 

      $.get("#request.webroot#cfc/assessment.cfc?method=getEncCatChildrenRemote", 
       function(jsonText){ 
        var qryTxOutcomes = JSON.parse(jsonText); 

        //qryTxOutcomes is now an object with 2 arrays: COLUMNS and DATA. 
        //COLUMNS is an array of strings of the column names. 
        //DATA is an array of arrays, where each array is a row. 
        //Thus, every data cell is DATA[rownumber][columnnumber] 

        //clear out any options first 
        for(var i=txOutcomeSelect.options.length-1; i>=0; i--) { 
         txOutcomeSelect.remove(i); 
        } 
        var firstOption = document.createElement('option'); 
        firstOption.setAttribute('value', ''); 
        firstOption.innerHTML = '--Select an Option--'; 
        txOutcomeSelect.appendChild(firstOption); 

        $.each(qryTxOutcomes.DATA, function() { 
         var thisOption = document.createElement('option'); 
         thisOption.setAttribute('value', $(this)[5]); 
         thisOption.innerHTML = $(this)[3]; 
         txOutcomeSelect.appendChild(thisOption); 
        }); 
       } 
      ).done(function(){ 
       if (bLoading) { 
        fmakeTxOutcomeSelected(txOutcomeSelect);      
       } 
      }) 
     }; 

     function fmakeTxOutcomeSelected(sel){ 
       var id = sel.id; 
       var idNum = id.charAt(id.length-1); 
       var arrOutcomeIds = []; 

       arrOutcomeIds[0] = ''; 
       arrOutcomeIds[1] = '#Get_cas.cEncOutcomeID#'; 
       arrOutcomeIds[2] = '#Get_cas.cEncOutcomeID2#'; 

       sel.value = arrOutcomeIds[idNum]; 
      }