Настройка моей модели с помощью Backbone.js

Я пытаюсь использовать Backbone.js для упрощения управления данными (JSON) и взаимодействия с DOM.

Во-первых, я не уверен, действительно ли Backbone.js может упростить и улучшить текущий процесс, но хотелось бы предположить, что может.

Раньше я извлекал данные с помощью функции jQuery AJAX. Теперь я извлекаю данные (все еще с помощью AJAX) в стиле Backbone в модель Backbone.

Для обновления ранее я анализировал сам объект JSON для обновления данных. Затем я бы отправил обновленный json обратно в серверную часть (так же, как я его получил).

Теперь можно ли использовать функцию set в Backbone для упрощения чего-то вроде приведенного ниже и в идеале, где должно быть построено поведение атрибута set (и все другие привязки пользовательского интерфейса, такие как события изменения)? Будет ли это в обработчике успеха fetch(), который находится в инициализаторе представления?

function setBucketOffer(bucketName, newId) {
    var segments = json.segments;
    for (var i = 0; i < segments.length; i++) {
        if (segments[i].market.toLowerCase() === g_market) {

            var genders = segments[i].gender;
            for (var i = 0; i < genders.length; i++) {
                if (genders[i].name.toLowerCase() === g_segment) {

                    var buckets = genders[i].buckets;
                    for (var i = 0; i < buckets.length; i++) {
                        if (buckets[i].name === bucketName) {

                            buckets[i].confirm = newId;
                            return;
                        }
                    }
                }
            }
        }
    }
}

Пример JSON

{
    "segments": [
        {
            "market": "Market1",
            "gender": [
                {
                    "name": "male",
                    "buckets": [
                        {
                            "name": "Market1_M_CBD",
                            "subscribers": "50,000",
                            "postcode": "20000-2010",
                            "lastsend": "13/03/12 4:30PM",
                            "suggest": "10054",
                            "confirm": ""
                        },
                        {
                            "name": "Market1_M_North",
                            "subscribers": "50,000",
                            "postcode": "20000-2010",
                            "lastsend": "13/03/12 4:30PM",
                            "suggest": "10054",
                            "confirm": ""
                        }
                    ]
                },
                {
                    "name": "female",
                    "buckets": [
                        {
                            "name": "Market1_F_CBD",
                            "subscribers": "50,000",
                            "postcode": "20000-2010",
                            "lastsend": "13/03/12 4:30PM",
                            "suggest": "10054",
                            "confirm": "10054"
                        }
                    ]
                }
            ]
        },
        {
            "market": "Market2",
            "gender": [
                {
                    "name": "male",
                    "buckets": [
                        {
                            "name": "Market2_M_CBD",
                            "subscribers": "50,000",
                            "postcode": "20000-2010",
                            "lastsend": "13/03/12 4:30PM",
                            "suggest": "10054",
                            "confirm": "10054"
                        },
                        {
                            "name": "Market2_M_North",
                            "subscribers": "50,000",
                            "postcode": "20000-2010",
                            "lastsend": "13/03/12 4:30PM",
                            "suggest": "10054",
                            "confirm": "10054"
                        },
                        {
                            "name": "Market2_M_South",
                            "subscribers": "50,000",
                            "postcode": "20000-2010",
                            "lastsend": "13/03/12 4:30PM",
                            "suggest": "10054",
                            "confirm": "10054"
                        }
                    ]
                }
            ]
        }
    ]
}

Изменить 1

Отсюда я пытаюсь эффективно использовать Parse и получать только сегменты из своего JSON:

var Offers = Backbone.Collection.extend({
    url: 'URL',
    parse: function (response) {
        return response.segments;
    }
});

Здесь я получаю больше, чем просто response.segments. Также не уверен, правильно ли мне использовать функцию рендеринга или функцию получения успеха для заполнения DOM. Предположим, у меня есть мой html-шаблон в DOM... Я хочу клонировать его с помощью jQuery clone() и заполнять клон с помощью forEach для сегментов и возвращать все клоны в тело html. Работает ли это в магистрали, как бы вы это сделали? (Я могу сделать это без backbone.js, но хотел бы посмотреть, как я могу улучшить с помощью backbone.js и привязать все данные о клонах к изменениям модели)

var OfferView = Backbone.View.extend({
    initialize: function () {
        this.model = new Offers();
        this.model.fetch({
            success: function (collection, response) {
                console.log(response);
            }
        });
        this.model.on('change', this.modelChange);
        this.model.on('change', this.render);
        this.modelChange = function () {
            alert('model changed');
        };
    },
    render: function () {

    }
});

Изменить 2

Я собираюсь создавать отдельные представления через forEach, но у меня возникают проблемы с их вставкой обратно в DOM. Что я делаю неправильно? (Не уверен в возврате этой части)

// DEFINE VIEW
var OfferView = Backbone.View.extend({
    initialize: function () {
        this.model = new Offers();
        this.model.fetch();
        this.model.on('change', this.modelChange);
        this.model.on('change', this.render);
        this.modelChange = function () {
            alert('model changed');
        };
        this.render();
    },
    render: function () {
        var self = this;
        this.model.forEach(function (s) {
            var view = new OfferMarketView({
                id: "container" + s.get('name').toLowerCase().replace(/\s*/g, '')
            });
            $('#leftCol').append(view.el);
        });
        return this;
    }
});
var OfferMarketView = Backbone.View.extend({
    tagName: "div",
    className: "marketContainer",
    events: {},
    render: function() {
    }
});