debugjavascriptMinor
Is this a good way to store error messages to display back to the user?
Viewed 0 times
thiserrortheuserwaystorebackmessagesgooddisplay
Problem
I use the following code to put all of my error messages for the application in one javascript variable. Is this efficient way to store my error messages?
MORE INFO
The code above is stored in a js file
I am referencing the error messages like this :
var cosmoBase = {
messages: {
empty: "Please enter ",
numeric: "Please enter a valid number for ",
date: "Please enter a valid date for "
}
};
//Error messages
var cosmo = {
messages: {
lastName: {
empty: cosmoBase.messages.empty + "Last Name"
},
dob: {
empty: cosmoBase.messages.empty + "Date of Birth",
invalid: cosmoBase.messages.date + "Date of Birth"
},
ssn: {
empty: cosmoBase.messages.empty + "SSN",
invalid: cosmoBase.messages.numeric + "SSN"
},
studentId :{
empty: cosmoBase.messages.empty + "Student ID",
invalid: cosmoBase.messages.numeric + "Student ID"
}
}
};MORE INFO
The code above is stored in a js file
I am referencing the error messages like this :
var validator = $("form:first").validate({
errorClass: 'Input_State_Error',
rules: {
lastName: {
required: true
},
dob: {
required: true,
date: true,
minlength: 10
},
ssn: {
required: true,
minlength: 4
},
studentId: {
required: true
}
},
messages: {
lastName: cosmo.messages.lastName.empty,
dob: {
required: cosmo.messages.dob.empty,
date: cosmo.messages.dob.invalid
},
ssn: cosmo.messages.ssn.empty,
studentId: cosmo.messages.studentId.empty
},
errorPlacement: function(error, element) {
error.appendTo($('#msg'));
}
});Solution
I would recommend you use a factory instead.
then just use
Having your logic in a factory rather then an object gives you more control and makes your code significantly more DRY.
Implementation of
live example
cosmo.error = function(id) {
...
};then just use
cosmo.error("ssn-empty")Having your logic in a factory rather then an object gives you more control and makes your code significantly more DRY.
Implementation of
error:var error = (function() {
var base = {
empty: "Please enter ",
numeric: "Please enter a valid number for ",
date: "Please enter a valid date for ",
ssn: "SSN",
lastName: "Last Name",
dob: "Date of Birth",
studentId: "Student ID"
};
var methods = {
"ssn": function(id) {
if (id === "invalid") {
return base.numeric + base.ssn;
}
},
"dob": function(id) {
if (id === "invalid") {
return base.date + base.dob;
}
},
"studentId": function(id) {
if (id === "invalid") {
return base.numeric + base.studentId;
}
},
};
return function(id) {
var parts = id.split("-");
if (parts[1] === "empty") {
return base.empty + base[parts[0]];
} else {
return methods[parts[0]](parts[1]);
}
}
}());
console.log(error("ssn-invalid"));live example
Code Snippets
cosmo.error = function(id) {
...
};var error = (function() {
var base = {
empty: "Please enter ",
numeric: "Please enter a valid number for ",
date: "Please enter a valid date for ",
ssn: "SSN",
lastName: "Last Name",
dob: "Date of Birth",
studentId: "Student ID"
};
var methods = {
"ssn": function(id) {
if (id === "invalid") {
return base.numeric + base.ssn;
}
},
"dob": function(id) {
if (id === "invalid") {
return base.date + base.dob;
}
},
"studentId": function(id) {
if (id === "invalid") {
return base.numeric + base.studentId;
}
},
};
return function(id) {
var parts = id.split("-");
if (parts[1] === "empty") {
return base.empty + base[parts[0]];
} else {
return methods[parts[0]](parts[1]);
}
}
}());
console.log(error("ssn-invalid"));Context
StackExchange Code Review Q#2387, answer score: 4
Revisions (0)
No revisions yet.