patternjavascriptMinor
Simple registration form
Viewed 0 times
formsimpleregistration
Problem
I'm very new to backbone.js and JavaScript. I would like to hear some reasonable critiques / advice against my JavaScript code based on backbone.js framework with backbone-forms.
The aim of this simple app is to present a user with a simple registration form (twitter bootstrap modal dialog) and upon clicking on registration button post the model to a RESTful web service.
Model:
Create an instanc
The aim of this simple app is to present a user with a simple registration form (twitter bootstrap modal dialog) and upon clicking on registration button post the model to a RESTful web service.
Model:
var MemberModel = Backbone.Model.extend({
schema: {
name: {
type: 'Text',
title: 'Full Name',
validators: [
'required'
],
editorAttrs: {
'placeholder': 'Type in your full name...',
'class':'input-xlarge'
}
},
email: {
dataType: 'email',
title: 'E-mail address',
validators: [
'required',
'email'
],
editorAttrs: {
'placeholder': 'Type in your email address...',
'class':'input-xlarge'
}
},
country: {
type: 'Select',
options: [
{
val: 0,
label: 'Choose a country...'
},
{
val: 1,
label: 'Country #1'
},
{
val: 2,
label: 'Country #2'
},
{
val: 3,
label: 'Country #3'
}
],
editorAttrs: {
'data-placeholder': 'Choose a country',
'class': 'input-xlarge'
}
}
},
urlRoot: '/api/members',
validate: function(attrs) {
var errors = {};
if ( attrs.country == 0 ) {
errors.country = 'Choose a country from list';
}
if ( !_.isEmpty(errors) ) return errors;
}
});Create an instanc
Solution
It's pretty good code. Well done! There are no major mistakes or pain points that would annoy other developers. All I can do is to nitpick a little bit.
-
First of all take a look at some JavaScript style guide. jQuery has a good one and Google has a great one, too. You may find many others and although they all diverge a little bit there are a lot of common practices that they all agree on. One of those is braces' positioning. Instead of
you'd better use
-
Another point is the use of
JavaScript is somewhat weird: I have to use
or
JavaScript is so easy! I'll use
I guess the former is better.
-
I noticed you use
Other than that your code is fine. I really like the fact that you use Underscore JS. That saves you and other developers a lot of time and headaches.
-
First of all take a look at some JavaScript style guide. jQuery has a good one and Google has a great one, too. You may find many others and although they all diverge a little bit there are a lot of common practices that they all agree on. One of those is braces' positioning. Instead of
render:
function()
{you'd better use
render: function () { // note the spaces, too :)-
Another point is the use of
=== instead of ==. I've noticed that you've never used a triple-equals operator in your code and I'm a little bit nervous. Maybe you know about the one vs. the other and you know what are you doing in this particular code (and btw your code works totally fine with double-equals). But what if you don't know? And what if some other developer who doesn't know JavaScript well take a look at your code and try to do something similar? Suppose he doesn't know the rules and you code is the largest and most complicated piece of JavaScript he's ever seen. Which way of thinking do you think is more bullet-proof for a JS-newbie:JavaScript is somewhat weird: I have to use
=== to compare things.or
JavaScript is so easy! I'll use
== to compare stuff everywhere in my code!I guess the former is better.
-
I noticed you use
.bind() method for event binding. Consider switching to new .on() method introduced in jQuery 1.7. One of the current goals for jQuery team is to make their library smaller and more lightweight so they work hard to cut off all the fat that's accumulated over the years. At some point in future they may remove the old API so it's better start using new API today to make your code future-proof. It''l be a lot less hassle to switch to new version of jQuery in future.Other than that your code is fine. I really like the fact that you use Underscore JS. That saves you and other developers a lot of time and headaches.
Code Snippets
render:
function()
{render: function () { // note the spaces, too :)Context
StackExchange Code Review Q#10728, answer score: 5
Revisions (0)
No revisions yet.