In this article I will explain with an example, how to check if TextBox is Empty using JavaScript.
When the Validate Button is clicked, a JavaScript function is called and the TextBox is referenced and its value is compared with Empty string and if the condition tests TRUE then the TextBox is considered Empty.
 
 
HTML Markup
The following HTML Markup consists of an HTML TextBox and a Button. The Button has been assigned with an OnClick event handler.
<input type="text" id="txtName" />
<input type="button" id="btnCheck" value="Check Empty" onclick="return ValidateTextBox()" />
 
 
JavaScript Code
When the Validate Button is clicked, the ValidateTextBox JavaScript function is called.
Inside the function, first the TextBox is referenced using JavaScript and then its value is trimmed and compared with an Empty string.
Note: The function trim is an inbuilt JavaScript function and is supported in all Modern browsers.
 
If the condition tests TRUE, the TextBox is considered Empty and a JavaScript Alert Message is displayed.
Finally, a FALSE value is returned in order to cancel event propagation.
<script type="text/javascript">
    function ValidateTextBox() {
        if (document.getElementById("txtName").value.trim() == "") {
            alert("Please enter Name!");
            return false;
        }
    };
</script>
 
 
Screenshot
Check if TextBox is Empty using JavaScript
 
 
Browser Compatibility

The above code has been tested in the following browsers.

Internet Explorer  FireFox  Chrome  Safari  Opera 

* All browser logos displayed above are property of their respective owners.

 
 
Demo
View Demo
 
 
Downloads
Download Code