Demonstrating Backbone.js: Validations Part 4

Introduction

Welcome to the "Demonstrating Backbone.js" article series. This article demonstrates how to create and use validations in Backbone.js. This article starts with the concept of Backbone.js and various components of it. Previous articles have provided an introduction to views and the implementation of routers and collections. You can get them from the following:

Builtin Validators
Here we will see some builti validators in Bacbone.js validation, each one in detail.
  1. Method Validator
  2. Named Method Validator
  3. required
  4. acceptance
  5. min
  6. max
  7. range
  8. length
  9. minLength
  10. maxLength
  11. rangeLength
  12. oneOf
  13. equalTo
  14. pattern
 
In my previous articles we saw the min, max and range validators, here we will see the remaining ones.
 
Length Validator 
 
It will validate that the value is a string with a length equal to the specified length.
  

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="JavaScript.aspx.cs" Inherits="JavaScript.JavaScript" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

<script src="backbone/Jquery.js" type="text/javascript"></script>

<script src="backbone/underscore-min.js" type="text/javascript"></script>

<script src="backbone/backbone-min.js" type="text/javascript"></script>

<script src="backbone/backbone-validation-amd-min.js" type="text/javascript"></script>

<script src="backbone/backbone-validation-min.js" type="text/javascript"></script>

</head>

<body>

<script type="text/javascript">

var Area = Backbone.Model.extend({

validation: {

postalCode: {

length: 4

}

}

});

</script>

</body>

</html>

Minlength Validator
 
It validates that the value is a string with a length equal to or greater than the specified min length.
 

<script type="text/javascript">

var User = Backbone.Model.extend({

validation: {

password: {

minLength: 8

}

}

});

</script>

 
 
 Maxlength Validator
 
It validates that the value is a string with a length equal to or less than the specified max length.

<script type="text/javascript">

var User = Backbone.Model.extend({

validation: {

password: {

maxLength: 100

}

}

});

</script>

 
Range Length Validator
 
It validates that the value is a string with a length between the two numbers specified, inclusive (in other words the supplied value's length can be equal to the lowest or highest value in the range).
 
 <script type="text/javascript">

var user = Backbone.Model.extend({

validation: {

password: {

rangeLength: [6, 100]

}

}

});

</script>

 
Oneof Validator 
 
It validates that the value is equal to one of the elements in the specified array. The matching is case sensitive.
 
 <script type="text/javascript">

var States = Backbone.Model.extend({

validation: {

state: {

oneOf: ['Andhrapradesh', 'Tamilnadu']

}

}

});

</script>

 Equalto Validator
 
 It validates that the value is equal to the value of the attribute with the name specified. 
 
 <script type="text/javascript">

var User = Backbone.Model.extend({

validation: {

password: {

required: true

},

passwordRepeat: {

equalTo: 'password'

}

}

});

</script>

 
Pattern Validator
 
It validates that the value matches the pattern specified. It can be a regular expression or the name of one of the builtin patterns. 
 

<script type="text/javascript">

var User = Backbone.Model.extend({

validation: {

email: {

pattern: 'email'

}

}

});

</script>

Summary

In this article, I explained how to use builtin validators in models in Backbone.js, In future articles we will understand them with a real-time application.