Builtin Validators
- method validator
- named method validator
- required
- acceptance
- min
- max
- range
- length
- minLength
- maxLength
- rangeLength
- oneOf
- equalTo
- pattern
Method Validator
<%@ 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 ProductModel = Backbone.Model.extend({
validation: {
name: function (value, attr, computedState) {
if (value !== 'something') {
return 'Name is invalid';
}
}
}
});
var SomeModel = Backbone.Model.extend({
validation: {
name: {
fn: function (value, attr, computedState) {
if (value !== 'something') {
return 'Name is invalid';
}
}
}
}
});
</script>
</body>
</html>
Named Method Validator
Here I created a Product Model where the name is to be validated.
<%@ 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 ProductModel = Backbone.Model.extend({
validation: {
name: 'validateName'
},
validateName: function (value, attr, computedState) {
if (value !== 'something') {
return 'Name is invalid';
}
}
});
var OrderModel = Backbone.Model.extend({
validation: {
name: {
fn: 'validateName'
}
},
validateName: function (value, attr, computedState) {
if (value !== 'something') {
return 'Name is invalid';
}
}
});
</script>
</body>
</html>
Required Validator
A Required Validator will validate that an attribute exists. This can be specified as either a boolean value or a function that returns a boolean value.
<%@ 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 ProductModel = Backbone.Model.extend({
validation: {
name: {
required: true
}
}
});
var OrderModel = Backbone.Model.extend({
validation: {
name: {
required: function (value, attr, computedState) {
return true;
}
}
}
});
</script>
</body>
</html>
Acceptance Validator An Acceptance Validator will validate that something has been accepted, for example terms of use.
<%@ 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 ProductModel = Backbone.Model.extend({
validation: {
termsOfUse: {
acceptance: true
}
}
});
</script>
</body>
</html>
Summary
In this article, I explained how to use the builtin validators in models in Backbone.js, In future articles we will understand the remaining Validations with examples.