0

私はEricHyndの素晴らしいマルチセレクトプラグインを使用して、いくつかのドロップダウンを設定しています。

1つはビジネスユニットです：..。

$('#lbBusinessUnits').multiselect({
height: "auto",
selectedList: 20
});

... 2つ目は、ビジネスエリア（#lbBusinessAreas）です。..。

$('#lbBusinessAreas').multiselect({
selectedList: 20
});

...ユニットが次のようにチェックされると、エリアのリストが更新されます。

// Business Units List Box Change
$('#lbBusinessUnits').bind("multiselectclick", function (event, ui) {
    var selectedPeriod = $('#ddlSalesPeriods').val();
    var selectedUnit = ui.value;
    var selectedUnitText = ui.text;
    var checkedUnit = ui.checked;
    var areChecked = $(this).multiselect("getChecked").map(function () { return this.value; }).get();

if (areChecked.length > 0) {
    url = '/InvoiceException/LoadBusinessareasBySalesPeriodBusinessUnit';
    $.getJSON(url, { selectedSalesPeriod: selectedPeriod, selectedBusinessUnits: areChecked }, function (areas) {
    var areaSelect = $('#lbBusinessAreas');
    areaSelect.empty();
    $.each(areas, function (index, optionData) {
         areaSelect.append($('<option/>', { value: optionData.Id, text: optionData.Name }));
      });
    });
    }
else {
     var url = '/InvoiceException/LoadBusinessAreasBySalesPeriod';
    $.getJSON(url, { selectedSalesPeriod: selectedPeriod }, function (areas) {
    var areaSelect = $('#lbBusinessAreas');
    areaSelect.empty();
    $.each(areas, function (index, optionData) {
    areaSelect.append($('<option/>', { value: optionData.Id, text: optionData.Name }));
    });
  });
}
$('#lbBusinessAreas').multiselect("refresh");
});

JSONの結果はMVC3コントローラーによって処理され、URL呼び出しから正しく返されます。IEで返されるデータは正しく見えます。

ただし、エリアボックス（#lbBusinessAreas）は、クリックしても正しく更新されません。ワンクリック遅れのようです。ボックスの更新で競合状態が発生しているようです。

これをFirebugに配置し、multiselect（ "refresh"）を呼び出すポイントにブレークポイントを設定すると、デバッガーをステップスルーするとすべてが正しく機能し、正常に動作します。

これは、オプションが更新される前に更新が終了する競合状態ですか？それはajax/getJson呼び出しだからですか？

操作の順序を確認するために、呼び出しを移動して更新したり、何らかの方法で把握したりする必要がありますか？IEでは、オプションの更新を完了してから、更新を実行する必要があります。

4

1 に答える 1

0

それがすべて言われ、行われた後、私は単純なリフレッシュがうまくいくと思いました。getJson呼び出しの成功が戻るのを待つ必要があることに気付いたときの/headbonkの瞬間。そのため、各呼び出しの成功関数に更新を移動する必要がありました。他の誰かが「おやおや」の瞬間を持っている場合に備えて、ここに変更/回答を投稿しました。

// Business Units List Box Change
$('#lbBusinessUnits').bind("multiselectclick", function (event, ui) {
    var selectedPeriod = $('#ddlSalesPeriods').val();
    var selectedUnit = ui.value;
    var selectedUnitText = ui.text;
    var checkedUnit = ui.checked;
    var areChecked = $(this).multiselect("getChecked").map(function () { return this.value; }).get();

    if (areChecked.length > 0) {
        url = '/InvoiceException/LoadBusinessareasBySalesPeriodBusinessUnit';
        $.getJSON(url, { selectedSalesPeriod: selectedPeriod, selectedBusinessUnits: areChecked }, function (areas) {
            var areaSelect = $('#lbBusinessAreas');
            areaSelect.empty();
            $.each(areas, function (index, optionData) {
                areaSelect.append($('<option/>', { value: optionData.Id, text: optionData.Name }));

            });
            **$('#lbBusinessAreas').multiselect("refresh");**
        });
    }
    else {
        var url = '/InvoiceException/LoadBusinessAreasBySalesPeriod';
        $.getJSON(url, { selectedSalesPeriod: selectedPeriod }, function (areas) {
            var areaSelect = $('#lbBusinessAreas');
            areaSelect.empty();
            $.each(areas, function (index, optionData) {
                areaSelect.append($('<option/>', { value: optionData.Id, text: optionData.Name }));
            });
            **$('#lbBusinessAreas').multiselect("refresh");**
        });
    }
});
于 2012-04-11T13:27:55.353 に答える