1

テキストボックスのblur関数でjquerypostメソッドを呼び出すMVCアプリケーションがあります。問題は、フォームに多くの入力フィールドがあり、各入力フィールドで同じajaxメソッドをぼかして呼び出すことです。ユーザーが異なるテキストボックスを非常に速くクリックインおよびクリックアウトすると、ajaxメソッドは2回3回呼び出し、間違った結果になります。

これが例です

    Flight 1
    Airline     Flight #    Class         Date
S1  TextBox1    TextBox2    TextBox3      TextBox4 
S2  TextBox1    TextBox2    TextBox3      TextBox4 
S3  TextBox1    TextBox2    TextBox3      TextBox4

私が疲れたこれに対する1つの解決策は、このようにajexを呼び出すときに提出されたすべての入力を無効にすることです

function Submit() {
     $('input').attr("disabled", "disabled");
     $.post("/ItineraryBuilder/GetFlightData", { opportunityId: oppID}, function (data) 
     {
          $("#DivResult").html(data);
          $('input').removeAttr("disabled");
     }
}

これにより、すべての入力フィールドが無効になり、ユーザーがテキストボックスから頻繁に出入りするように制限されます。これにより、Ajaxpostが何度も呼び出されることはありません。ただし、入力フィールドが無効になるとすぐにフォーカスも失われ、この場合はTABの使用が困難になります。

それで、ajax呼び出しまたはコントローラー/アクションをしばらくロックダウンして、あるアクションが処理されるまで別のアクションが開始されないようにする方法、またはこれを行うための他のより良い方法はありますか？

私の主張を明確にしたいと思います。

4

3 に答える 3

3

代わりにオーバーレイを使用してください。

ElementOverlayという小さなプラグインを作成しました。次のように使用できます。

function Submit() {
     $('#yourForm').elementOverlay();

     $('input').attr("disabled", "disabled");
     $.post("/ItineraryBuilder/GetFlightData", { opportunityId: oppID}, function (data) 
     {
          $('#yourForm').elementOverlay('destroy');

          $("#DivResult").html(data);
          $('input').removeAttr("disabled");
     }
}

これはフォームをオーバーレイするだけなので、ユーザーはページの残りの部分を操作できます。

スクリプト：https ：//github.com/jgauffin/griffin.jquery.tools/blob/master/Source/jquery.griffin.elementoverlay.js （[未加工]ボタンをクリックしてダウンロードします）

于 2012-08-20T07:15:47.733 に答える
1 
if($.active){ 
  //there's an ajax function running
}else{ 
  //there's no ajax function running
}
于 2012-08-20T07:17:04.410 に答える
0

フォーカスが失われたことを除いて独自のソリューションが好きな場合は、次のようにすることができます。

フォームをテーブルに配置しているように見えるため、「next（）」はおそらく機能しないため、複雑な「each」関数を使用して次の入力を決定しました。ちなみに、あなたはクロージング "）;"を逃していました あなたのポストコールで。

    $('input').on('blur', function(){
      $('input').attr('disabled', true);
      $(this).addClass('last-edited');
      var tagnext = false;
      $('input').each(function(){
          if(tagnext){
             $(this).addClass('next-focus');
             tagnext = false;
          }
          if($(this).hasClass('last-edited')){
             $(this).removeClass('last-edited');
             tagnext = true;
          }
      });
      Submit();           
    });



   function Submit(){
      $.post('/ItineraryBuilder/GetFlightData', { opportunityId: oppID}, function (data) 
      {
         $('#DivResult').html(data);
         $('.next-focus').focus();
         $('input').removeAttr('disabled');
      });
   }
于 2012-08-20T08:23:00.423 に答える