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)

私が抱えている問題は、テキストボックスにすばやく入力してから送信すると発生します。基本的に、サーバーへのすべての可能性のあるリクエストが返される前に、フォームが送信されます。

すべての可能性の要求が返される前に発生しないように、送信イベントをキューに入れる方法はありますか?

4

2 に答える 2

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

shouldについてはわかりませんが、私が使用する基本的なアプローチは次のとおりです。

  1. ビューを初期化するときは、this.outstanding_callbacks = 0; を設定します。
  2. $.getJSON 呼び出しを行う直前に、その変数 (this.outstanding_callbacks++) をインクリメントします。
  3. @buildConceptAttrs で、その var (this.outstanding_callbacks--) をデクリメントします。
  4. 送信するときは、outside_callbacks を確認してください。> 0 の場合は送信しないでください。代わりに、window.setTimeout(5000, retryFunction) を実行します。ここで、5000 は待機するミリ秒数であり、retryFunction は基本的に同じ関数です (文字通り同じ関数である可能性があります)。

ここで、ステップ 3 と 4 でビューにアクセスできるように、バインディングなどを行う必要があるかもしれませんが、大まかなアイデアが得られることを願っています。

于 2012-04-18T19:16:38.380 に答える
0

jQuery.ajaxStartおよびjQuery.ajaxStopイベントをキャプチャします。

読み込み中のメッセージを表示します:

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

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

ただし、同じ手法を使用して を無効にするか、少なくともが送信を実行するのをform.submit()待つことができます。.ajasStop()

処理中のすべてのイベントを実際に待っているわけではありません.. AJAXのものだけ..しかし、おそらくそれはあなたの問題を十分に解決します.

于 2012-04-18T20:43:59.930 に答える