2012-04-18 4 views
2

私は、ユーザーがテキストフィールドに単語を入力してフォームを送信できるバックボーンベースのビューを持っています。ビューに関連付けられた2つのイベント、submitおよびkeyupがあります。ユーザーの種類としてサーバーが返されるまでフォームのサブミット要求をキューに入れる

class NewConceptView extends Backbone.View 
    el: '#new-concept-cont' 
    template: JST['concepts/new'] 

    events: 
    'submit form': 'handleSubmit' 
    'keyup #concept_title' : 'getPossibilities' 

、私は自分のサーバーをヒットする必要があり、ユーザーが(ちょうどオートコンプリートのプラグインのように)入力しているかについて(possibilitiesと呼ばれる)いくつかのデータを要求します。

getPossibilities: (e) -> 
    currentText = @titleInput.val() 
    if currentText.length > 0 
    params = { text: currentText } 
    $.getJSON(url, params, @buildConceptAttrs) 

ユーザーがフォームを送信すると、サーバーから最後の可能性を取り出してコレクションに追加する必要があります。

handleSubmit: (e) -> 
    e.preventDefault() 
    @titleInput.val('') 
    @collection.create(@conceptAttrs) 

私は、テキストボックスに速く入力し、提出ヒット時に私がいる問題が発生します。基本的には、サーバーへのすべての可能性要求が返される前にフォームが送信されます。

可能性のすべての要求が返される前にイベントが送信されないようにイベントを送信する方法がありますか?

答えて

0
Is there a way that I should be queuing submit events 

まあ、私は約べきを知らないが、私は使用したい基本的なアプローチは、次のようになります。

  1. あなたのビューを初期化し、this.outstanding_callbacks = 0を設定します。
  2. あなたは$ .getJSON呼び出しを行う直前に、そのVAR(this.outstanding_callbacks ++)@buildConceptAttrsで
  3. がデクリメントをインクリメントすることVAR(this.outstanding_callbacks--)
  4. あなたがoutstanding_callbacksを確認し、提出して行きます。それが> 0なら、提出しないでください。代わりに、window.setTimeoutは(5000、retryFunction)5000は、しかし、多くのミリ秒はあなたが待ちたいとretryFunctionは基本的に同じ機能であり、やる今

(それは文字通り同じ機能であるかもしれない)、あなたが持っていることいくつかのバインディングや何かをして、ステップ#3と#4のビューにアクセスできるようにしてください。うまくいけば大まかなアイデアが得られます。

0

私はjQuery.ajaxStartjQuery.ajaxStopイベントをキャプチャします。

私はロードメッセージを示しています。

$(function(){ 
    $('#loading').ajaxStart(function() { 
    $(this).animate({ top: "0" }, 200); 
    }); 

    $('#loading').ajaxStop(function() { 
    $(this).animate({ top: "-70" }, 100); 
    }); 
}); 

しかし、あなたはform.submit()を無効にするには、同じ技術を使用し、または少なくとも提出を実行するために.ajasStop()のを待つことができますアイデアを服用します。

実際に処理中のすべてのイベントを待っているわけではありません。AJAXの場合のみですが、おそらく問題を十分に解決します。

関連する問題