0

I added this to my backbone-extend.js file which resides in the same folder as backbone-min.js...

_.extend(Backbone.View.prototype, {
    getFormData: function(form) { 
        var unindexed_array = form.serializeArray();
        var indexed_array = {};

        $.map(unindexed_array, function(n, i){
            indexed_array[n['name']] = n['value'];
        });

        return indexed_array;
    }
});

However, when I call this.getFormData in my view code, I get a method not defined error. What am I missing? Thanks for your help!

Edit: Here is my view. I have to uncomment the getFormData method to make it work. It can't see the getFormData otherwise...

define([
        'jquery',
        'underscore',
        'backbone',
        'models/Member',
        'text!templates/memberEditTemplate.html'
    ], function($, _, Backbone, Member, memberEditTemplate) {

    var MemberEditView = Backbone.View.extend({

        el: $("#page"),

        model: 'member',

        initialize: function(args) {
            this.member = new Member({ id: args.id });
            this.member.on('error', this.eventSyncError, this);
            this.member.on('sync', this.eventSyncModelLoaded, this);
            this.member.fetch();
        },

        events: {
          "click #bttnMemberSave": "bttnClickMemberSave"
        },

        eventSyncError: function(model,response,options) {
            console.log('Sync error='+response.statusText);
            $('#server-message').css({'color':'red', 'font-weight':'bold'}).text(response.statusText);
            //$('#server-message').text(response.statusText);
        },

        eventSyncModelLoaded: function(model,response,options) {
            this.render();
        },

        eventSyncModelSaved: function(model,response,options) {
            console.log("Member saved!");
            $('#server-message').css({'color':'green', 'font-weight':'bold'}).text("Member saved!");
            //$('#server-message').text('Member saved!');
            var to = setTimeout(function() { Backbone.history.navigate('members', true); }, 2000);
        },

        bttnClickMemberSave: function() {
            var data = this.getFormData($('#member-form').find('form'));
            this.member.save(data, { success: this.eventSyncModelSaved });
        },

        // getFormData: function(form) { 
        //     var unindexed_array = form.serializeArray();
        //     var indexed_array = {};

        //     $.map(unindexed_array, function(n, i){
        //         indexed_array[n['name']] = n['value'];
        //     });

        //     return indexed_array;
        // },

        render: function() {
            this.member.toJSON();
            var compiledTemplate = _.template( memberEditTemplate, { member: this.member } );
            this.$el.html( compiledTemplate ); 
            return this;
        }

    });

    return MemberEditView;

});
Locohost
  • 1,682
  • 5
  • 25
  • 38
  • Could you provide the code where you're instantiating the view, and invoking the method? That would help us out. – Lukas Jul 31 '13 at 17:13
  • @Lukas: Just posted the view. The view is fully functional. No issue with that code. I just can't get it to see the getFormData extension method. Only works with that method local. – Locohost Jul 31 '13 at 19:30
  • Are you ever instantiating a view by calling `new MemberEditView()` or `new Backbone.View()`? – Lukas Jul 31 '13 at 21:19
  • @Lukas: Yes in router.js. Here's another question: If I were to move the _.extend code above out of the backbone-extend.js file (which isn't loading for some reason), where would I put the code? In main.js? Or in app.js? I think I tried in app.js initialize method and it didn't work either. – Locohost Aug 01 '13 at 10:32
  • I'm thinking my assumption that backbone-extend.js is some file that auto-loads is bad. I could try adding this file to the RequireJS 'define' in my app.js. – Locohost Aug 01 '13 at 12:44
  • Why would the backbone-extend.js file load on its own? You'll definitely have to explicitly load that file. – Lukas Aug 01 '13 at 14:38
  • 1
    @Lukas: Yeah I'm not sure why I assumed that. I guess in my head I figured/guessed that's how it _should_ word. But it seems now that was a bad guess :-/ – Locohost Aug 01 '13 at 15:54

1 Answers1

0

Ok, I added backbone-extend.js to the RequireJS required files array in my app.js, now it's working.

Locohost
  • 1,682
  • 5
  • 25
  • 38