0

index.phpページに画像アップローダーがあります。画像のアップロードが開始されると(画像をアップロードボックスにドラッグすることで開始されます)、POSTリクエストが作成されます(FYI HTML5 + php Uploader)

POST http://localhost:8888/backbone_images/post_file.php

post_file.php内で、アップロードした画像のURLを、後でグローバルjavascript変数「globe」に割り当てるスクリプトのexit_statusに挿入して取得します。

if(move_uploaded_file($pic['tmp_name'], $upload_dir.$pic['name'])){
        exit_status($pic['name']);
    }

バックボーンスクリプトファイル内で、ドロップボックスへのドロップイベントをチェックします。これは機能します。

App.Views.AddImage = Backbone.View.extend({
    el: '#addImage',  
    events: {
        'drop': 'submit' 
    }, 

そのため、画像はドロップボックスにドラッグされ、送信関数を呼び出して新しいモデルを作成し、新しい画像のURL(javascript変数を介して)を新しいモデルのURLに割り当てます。

    submit: function(e) {
        e.preventDefault();  // preventing default submission..
        var newImage = globe;  // assign globe --url of the newly created image--to new model
        var imager = new App.Models.Person({ url: newImage });//creating a new img object
        this.collection.add(imager); 
    }

問題は、画像がドロップされた後にバックボーン送信機能がトリガーされたときに、/ post_file.phpへのPOSTがまだ実行されていないため、変数'globe'に新しいURLが含まれておらず、新しく作成されたモデルにURLがないことになります

質問:画像がドロップされた後、「送信」機能を実行する前に、バックボーンイベント内でPOSTが終了するのを待つ方法はありますか?

使用しようとしました:$.when( $.ajax("/post_file.php") )送信関数内で、これはすべて、別のPOSTリクエストを実行し、変数値を残して、待機している画像URLを取得する元のPOSTリクエストを実行します。

私の好みのワークフローは

a。画像のドラッグ/アップロード、(POSTが実行)b。アップロードされた画像のURLを使用して新しいモデルがコレクションに追加されます。

ただし、最初にクリック機能を追加する必要はありません。そうしないと、POSTが終了しません。

a。画像のドラッグ/アップロード、(POSTパフォーマンス)b。送信ボタンをクリックしますc。モデルがコレクションに追加されます

4

0 に答える 0