There's a widespread tendency to consider the value property of a text field as an attribute instead of a simple property whose value is a string. Such property cannot have a primitive null value because the DOM specifications allow only nodes to have such a value. jQuery wraps the value property with its method val() and it uses the same principles. Let's see why an empty value of a text field cannot be null.
value is not an attribute node, but a property whose value is a string (string). So if you test this property against the null value, you won't get what you expect because this value applies to DOM nodes. For example:
<form action="#" method="get" id="test"> <div> <input type="text" name="q" id="q" /> <input type="submit" value="Search" /> </div> </form>
We can run the following test, using both jQuery and the DOM:
$(function() {
$('#test').submit(function(event) {
var $form = $(this);
var value = $('#q', $form).val();
var value2 = document.getElementById('q').value;
console.log(typeof value); // string
console.log(typeof value2); // string
event.preventDefault();
});
});
Either the text field has a value or not, the final result is always a string. So this is the correct check:
if(value == '' || value.length == 0) {
// message
}