Model Validation in Backbone.JS: Part 3

In the previous parts, we saw:

• Introduction to Backbone.JS: Part 1
• Model in Backbone.JS : Part 2 

Let's move further into validation in the model.

 

Backbone.Validation

When users visit our websites, the user must opt for a great experience and this is done using validation. In this section I will go through why validation is so important and how it could be implemented as the validation of the model in Backbone. So, to make the system or user experience a reliable, it becomes really very important to do validation there. Backbone.js provides the validate method for this. This method is left undefined but we can override this method with our own validation logic.

validate
model.validate(attributes, options)

The Backbone validate method is left undefined but we can override it with our custom validation logic. It gives us an extensible way of declaring validation rules/logics on our model and overrides this validate method of Backbone as well. This method is called by Backbone during validation.

The validate method is ed the method attributes as well as the options from the save or set. It is called before save by default. We can call validate before the set also if we {validate: true}. If attributes match the validation logic, or we can say if the attributes are valid, then the validate method does not return anything and if the attributes are not valid then it will return an error, the error might be one of choice, can be a simple string error or an error object.

If the validate method returns an error message, then the model attributes will not be modified on the server. It is due to model.save([attributes], [options]) will not be continued after an error.

Without using the validate function.

This piece of code is not bad until we have no validation logic. For example, we had DeptNo that cannot be negative, we need to tell the user to enter a positive number in DeptNo. In this situatuation this might be a mess. 

var Employee = Backbone.Model.extend({
defaults: {
Fname: 'ishriss',
DeptNo: 2,
position:'Developer'
},
work: function () {
return this.get('Fname') + 'is employed here';
}
});

For telling the user that he has entered an invalid data as soon as possible or before sending on the server, for that here we use the validate method. In case the user entered invalid data to the validated field, an 'invalid' event will be triggered. The validate method will return a value that will be set with the validatinError property on the model. 

var Employee = Backbone.Model.extend({
defaults: {
Fname: 'ishriss',
DeptNo: 2,
position:'Developer'
},
validate: function(attrs){
if(attrs.DeptNo<0){
return 'DeptNo must be Positive';
}
},
work: function () {
return this.get('Fname') + 'is employed here';
}
});

validationError 

model.validationError

This is the return value by validate method after a failed validation or after the 'invalid' event is triggered. It might be of our type, a simple string or an error object. 

validate: function(attrs){
if(attrs.DeptNo<0){
// validationError
}
},

isValid 

model.isValid()

The isValid method runs the validate method to check the model state. It checks the validations of each attribute, an array of attributes and the model. When no validation has occured and the model has validated the isValid method returns undefined, we can true or false as an argument.

If we true as an argument, it will force the validation to check for the model state before the result is returned. 

var isValid = model.isValid(true)
// this will force for validation before return result

We can check whether or not the attributes are valid by ing the names of the attributes or an array of names: 

// Check if Fname is valid
var isValid = model.isValid('Fname');

// Check if Fname and DeptNo are valid
var isValid = model.isValid(['name', 'DeptNo']);

Summary

In this article we learned about the validation in model. I will try to continue this series of tutorials on Backbone. JS.