I have a form with one textbox. I want to check when the textbox value is empty and make some sort of red border surrounding the textbox itself when it's empty.
if (document.getElementById('pageh').value == "") {
alert("One of the fields is empty.");
return false;
}
That's my validation, but how do I add the red border?
I have a form with one textbox. I want to check when the textbox value is empty and make some sort of red border surrounding the textbox itself when it's empty.
if (document.getElementById('pageh').value == "") {
alert("One of the fields is empty.");
return false;
}
That's my validation, but how do I add the red border?
Share Improve this question edited Dec 19, 2012 at 19:27 Sampson 269k76 gold badges545 silver badges568 bronze badges asked Dec 19, 2012 at 19:22 zarkozarko 1511 gold badge3 silver badges11 bronze badges2 Answers
Reset to default 5var field = document.getElementById('pageh');
if (field.value == "") {
document.getElementById('pageh').style.border = "solid 1px red";
alert("One of the fields is empty.");
return false;
}
Maybe something like that?
var textbox = document.getElementById("pageh");
if (textbox.value.replace(/^\s+|\s+$/g, "") === "") {
textbox.style.border = "1px solid #ff0000";
}
Note, don't be afraid of replace
part: this is just cross-browser text trim.