15

Backbone.js を使用する方法はありますか?それは、formdata オブジェクトをサーバーに送信できるモデル アーキテクチャですか? 私が直面している問題は、Backbone が送信するものはすべて JSON としてエンコードされているため、formdata オブジェクトが適切に送信されないことです (明らかに)。

jQuery ajax リクエストを作成し、データ プロパティとして formdata オブジェクトを含めることで一時的にこの問題を回避していますが、これは理想的とは言えません。

4

7 に答える 7

7

この質問に答えを追加するだけで、次のようにオーバーライドせずに行った方法を次に示しますsync

私の見解では、次のようなものがあります。

$('#' + $(e.currentTarget).data('fileTarget')).trigger('click').unbind('change').bind('change', function(){
    var form_data = new FormData();
    form_data.append('file', $(this)[0].files[0]);
    appManager.trigger('user:picture:change', form_data);
});

次に、これを行うコントローラーで関数をトリガーします。

var picture_entity = new appManager.Entities.ProfilePicture();
picture_entity.save(null, {
    data: data,
    contentType: false,
    processData: false,
});

その時点でdataFormDataオブジェクトで jQuery をオーバーライドしています。

于 2013-08-23T14:51:45.787 に答える
7

同様の要件がありましたが、これが私がしたことです:

ビューで :

var HomeView = Backbone.View.extend({
    el: "#template_loader",
    initialize: function () {
        console.log('Home View Initialized');
    },
    render: function () {
        var inputData = {
            cId: cId,
            latitude: latitude,
            longitude: longitude
        };

        var data = new FormData();

        data.append('data', JSON.stringify(inputData));

        that.model.save(data, {
            data: data,
            processData: false,
            cache: false,
            contentType: false,
            success: function (model, result) {
                alert("Success");
            },
            error: function () {
                alert("Error");
            }
        });
    }
});    

お役に立てれば。

于 2014-01-10T11:23:45.083 に答える
2

同じ問題がありました。上記の方法で解決できます。

var $form = $("myFormSelector");

//==> GET MODEL FROM FORM
var model = new MyBackboneModel();
var myData = null;
var ajaxOptions = {};
// Check if it is a multipart request.
if ($form.hasFile()) {
    myData = new FormData($form[0]);
    ajaxOptions = {
        type: "POST",
        data: myData,
        processData: false,
        cache: false,
        contentType: false
    };
} else {
    myData = $form.serializeObject();
}

// Save the model.
model.save(myData, $.extend({}, ajaxOptions, {
    success: function(model, data, response) {
        //==> INSERT SUCCESS
    },
    error: function(model, response) {
        //==> INSERT ERROR
    }
}));

hasFile は、JQuery 関数を拡張するカスタム メソッドです。

$.fn.hasFile = function() {
    if ($.type(this) === "undefined")
        return false;

    var hasFile = false;
    $.each($(this).find(":file"), function(key, input) {
        if ($(input).val().length > 0) {
            hasFile = true;
        }
    });

    return hasFile;
};
于 2014-08-23T12:24:36.630 に答える
1

以下はシンプルで簡単な解決策です。syncメソッドをオーバーライドして、options.contentType次のようにします。

sync: function(method, model, options) {
    options = _.extend({
        contentType : 'application/x-www-form-urlencoded;charset=UTF-8'
    }, options);

    options.data = jQuery.param(model.toJSON());

    return Backbone.sync.call(this, method, model, options);
}
于 2015-12-24T15:53:05.263 に答える