7

I am attempting to use Backbone Validation with Backbone Stickit, I wish to validate one attribute at a time as the user enters them. However, when a user enters a value all attributes on the model get validated instead of just the one the user has changed. What am I doing wrong?

My View:

bindings:{
        '#username' : {
           observe:'username',
           setOptions: {
                validate:true
           }
        },

        '#email' : {
           observe:'email',
           setOptions: {
                validate:true
           }
        },

        '#firstname' : {
           observe:'firstName',
           setOptions: {
                validate:true
           }
        }, 

.......

onShow: function(){    
        Backbone.Validation.bind(this, {
              valid: function(view, attr) {
                alert('VALID - ' + attr);
              },
              invalid: function(view, attr, error) {
                alert('INVALID - ' + attr);
              }
            });

        this.stickit();

    },
Francium123
  • 451
  • 5
  • 19

4 Answers4

4

Everything you pass through setOptions is used when setting the value in the model (1). When you pass validate: true to the set function of a Backbone model it will validate the values in the model as well as the values passed to the set function (2) meaning it will validate the whole model every time you set a new value causing the problem you're seeing now. You're not doing anything wrong.

You could probably solve this by splitting up your validation into multiple separate functions and calling only the required ones on attribute change and then changing the validate function to call all those separate functions to validate the entire model.

yousefcisco
  • 127
  • 2
  • 13
  • Can you please elaborate? – Bharath Bhandarkar Jun 19 '14 at 05:32
  • 1
    The main issue here is that Backbone will validate the entire model when ```validate: true``` is passed. One solution to this would be to create separate validation functions (eg. validateCountry, validatePhone) and then set event listeners for change on country and phone to trigger the validation function. However, this solution isn't great and adds a whole load of complexity to your application. Here's an incomplete gist of what this solution could look like (it got too complex to finish) https://gist.github.com/yousefcisco/5ba5d571eff103650c87 – yousefcisco Jun 22 '14 at 18:33
1

This happened to me as well. In my case, I was setting default values in the model as '' (blank). Removed them and it worked

1

For this to work you should remove defaults (at least for the attributes your validating) values from your model

erratbi
  • 87
  • 12
  • could you explain more? please read How to improve your answer http://meta.stackoverflow.com/q/253804/3664960 if this actually was your answer – davejal Nov 23 '15 at 01:30
0

Try using the backbone.validation forceUpdate parameter on your backbone.stickit setOptions object in yout view bindings. That worked for me and I had a kind of similar problem.

Just like yousefcisco mentioned, backbone will validate all the attributes in the model on set or save, depending of your options passed, but in my case is not that I needed to validate each attribute separately, but the attributes didn't get set even if only one attribute was invalid, then I tried the forceUpdate: true, and it did its magic.

check it here: http://thedersen.com/projects/backbone-validation/#configuration/force-update

UtopiaLtd
  • 2,520
  • 1
  • 30
  • 46
quarkmarino
  • 1
  • 1
  • 2