1

mySQLデータベースから返される結果を絞り込むためのフィルターとして機能する5つのHTMLドロップダウンのセットがあります。関連する3つのフィルターは、それぞれ「州」、「地域」、「都市」の選択用です。

私には3つの機能があります:

  1. findSchools()、フィルター(CSSクラスでマークされている.filter)のいずれかが変更されたときに実行され、PHPスクリプトからAJAXを介して結果をフェッチします。それが完了すると、他の2つの関数が呼び出されます...

  2. changeRegionOptions()、これは、「Province」フィルターを変更すると、最初の関数と同じ方法を使用して使用可能なオプションを更新しますが、別のスクリプトに投稿します。

  3. changeCityOptions()、「Region」フィルターが変更された場合に実行され、同じ方法を使用してオプションを更新します。

問題は、これらのAJAX関数を同時に実行したいので、本質的に非同期で$.when実行するため、関数の実行を制御するためにを使用しようとしましたが、問題は解決しません。

関数は実行されますが、RegionフィルターとCityフィルターは空白を返します(オプションなし)。POSTリクエストが通過した場合でも、FireBugレポートには出力がまったく表示されません。filter_provinceの投稿されたパラメーターは正常に送信されますが、regionのパラメーターは最後に切り捨てられます。つまり、filter_region=値が渡されずにとして送信されます。だから私は私の論理がどこか間違っていると推測しています。コードは以下のとおりです。

// When any of the filters are changed, let's query the database...
$("select.filter").change(function() {
    findSchools();
});

  // First, we see if there are any results...
      function findSchools() {

          var sch_province = document.filterform.filter_province.value;
          var sch_region = document.filterform.filter_region.value;
          var sch_city = document.filterform.filter_city.value;
          var sch_cat = document.filterform.filter_category.value;
          var sch_type = document.filterform.filter_type.value;

          $.post("fetch_results.php",
          { filter_province : sch_province,
            filter_region : sch_region,
            filter_city : sch_city,
            filter_category : sch_cat,
            filter_type : sch_type },

            function(data) {

              $("#results").html("");
              $("#results").hide();
              $("#results").html(data);
              $("#results").fadeIn(600);
            }
          );

    // Once the results are fetched, we want to see if the filter they changed
       was the one for Province, and if so, update the Region and City options
        to match that selection...

            $("#filter_province").change(function() {

                $.when(findSchools())
                .done(changeRegionOptions());

                $.when(changeRegionOptions())
                .done(changeCityOptions());
        });
  };

これは、私が解決しようとした方法の1つにすぎません。IFステートメントを使用して、一般関数内で関数を直接呼び出してみましたがselect.filter.change()(後findSchools();)、すべて同じ結果が返されます。

これに関するどんな助けも素晴らしいでしょう!

4

2 に答える 2

0

これを試してください。これがあなたが期待していたものであることを願っています。jsfiddle->サンプルコード

于 2012-07-09T05:15:53.427 に答える
0

async を false にする必要があります。その後、コードは 1 行ずつ実行されます。

たとえば、このように $.post を呼び出す前に

$.ajaxSetup({async:false});
于 2012-07-08T21:11:31.670 に答える