0

Sorry for my title, it could not be relevant. I'll try to explain better in this post :) I understand my problem and I find a solution but I'm not sur this is the good way to do it, so I would like some advise.

My workflow:

  • I have a form where the user can enter an id.
  • I make a validation (empty field etc.) and call an API when he click on submit.
  • if the id exist, I register all the information in my database and send a response with an User Object(Symfony2 + fosRestBunble)

My problem: When I click for the first time on the form, it works well and a new user his create. But when I try to register a second user, he makes a PUT request because of the id send with the previous user object.

I understand why when I see my code, because I initialize my user model in the intialize function of my view. (before it was outside)

Here is my view:

define(['backbone',
    'views/notification/form',
    'models/form',
    'text!templates/user-form.tpl'],
function(Backbone,
        NotificationForm,
        User,
        FormTpl) {

    var UserForm = Backbone.View.extend({
        el: "#user-form",

        template: _.template(FormTpl),

        initialize: function() {
            this.model = new User();
            this.model.on("invalid",this.showErrors, this);
            this.model.on('request',this.ajaxStart, this);
            this.model.on('sync',this.ajaxComplete, this);
        },

        events: {
            submit: 'register'
        },

        render: function() {
            this.$el.html(this.template());
        },

        register: function(e) {
            e.preventDefault();
            var attrs = {
                counter: 0,
                created: new Date(),
                updated: new Date(),
                stackexchangeId: $('#stackId').val(),
                site: $('#site').find(":selected").text()
            };

            var self = this;
            this.model.save(attrs,
                {
                    wait:true,
                    success: function(model, response) {
                        console.log('success ajax');
                        console.log(model);
                        console.log(response);
                        self.collection.add(model);
                        //self.collection.add(new User(response));
                        var form = { id:'#user', messages: 'User has been registered' };
                        var success = new NotificationForm({ type: 'success', form: form} );
                        success.closeSuccessNotification();
                    },
                    error: function(model, xhr, options) {
                        self.ajaxComplete();
                        if(xhr.status == '500') {
                             var form = { id:'#user', messages: 'Connection StackExchange                  API failed' };
                        } else {
                            var response = JSON.parse(xhr.responseText);
                            var form = { id:'#user', messages: response.users };
                        }
                        new NotificationForm({ type: 'warning', form: form} );
                    }
                }
            );
        },

        showErrors: function(errors) {
            var form = { id:'#user', messages: errors.validationError };
            new NotificationForm({ type: 'error', form: form} );
        },

        ajaxStart: function() {
            this.$('#spinner-register').addClass('spinner-anim');
        },

        ajaxComplete: function() {
            this.$('#spinner-register').removeClass('spinner-anim');
        }
    });

return UserForm;

So when I click a second time my model is the same and the id is here.

I have found a solution but I'm not sur this is a good one because I have to move my event from the initialize function. So I create that :

test: function(model) {
            model.on("invalid",this.showErrors, this);
            model.on('request',this.ajaxStart, this);
            model.on('sync',this.ajaxComplete, this);
        },

and in register I make that:

register: function(e) {
            this.model = new User();
            this.test(this.model);
            e.preventDefault();
   etc.
 }

It works fine but I totally remove the initialize function, it doesn't sound very good. I would like to keep the initialize like in my first example and to always have a new User model. Thanks :)

4

1 回答 1

1

您可以使用model.clear()使模型像新的一样新鲜，然后save()将发送 POST 请求。

...
this.model.clear();
this.model.save(attrs,
...
于 2013-08-14T10:08:47.963 回答