How to Check If a Textbox Is Empty Using JavaScript

function checkTextField(field) {  document.getElementById("error").innerText =    (field.value === "") ? "Field is empty." : "Field is filled.";}

<input type="text" onblur="checkTextField(this);" /><p id="error"></p>

Checking textbox if it's empty in Javascript

It should be this:

var chatinput = document.getElementById("chatinput").value;
if (chatinput == "" || chatinput.length == 0 || chatinput == null)
{
    // Invalid... Box is empty
}

Or shorthanded:

if (!document.getElementById("chatinput").value)
{
    // Invalid... Box is empty
}

The = assigns a value whereas == checks whether the values are equal.

Check if textbox is blank in javascript

Use $.trim() function to remove all white-space from beginning and end of the string

if ($.trim($('#txtEmail').val()) != "")
{
     // do something
}

How to check whether a text box is empty or not?

You need to do onclick="return check();"

How to check if the any of my textbox is empty or not in javascript

By using jQuery selectors for selecting the elements, you have a jQuery object and you should use val() method for getting/setting value of input elements.

Also note that :text selector is deprecated and it would be better to trim the text for removing whitespace characters. you can use $.trim utility function.

function checking() {
    var textBox =  $.trim( $('input[type=text]').val() )
    if (textBox == "") {
        $("#error").show('slow');
    }
}

If you want to use value property you should first convert the jQuery object to a raw DOM object. You can use [index] or get method.

 var textBox = $('input[type=text]')[0].value;

If you have multiple inputs you should loop through them.

function checking() {
    var empty = 0;
    $('input[type=text]').each(function(){
       if (this.value == "") {
           empty++;
           $("#error").show('slow');
       } 
    })
   alert(empty + ' empty input(s)')
}

How to check if textbox is empty and display a popup message if it is using jquery?

Firstly I'm assuming that the missing $ is just a typo in the question, as you state that you see the validation message appear.

The reason you're seeing the 'Please fill out this field' notification is because you've used the required attribute on the field. If you want to validate the form manually then remove that attribute. You will also need to hook to the submit event of the form, not the click of the button and prevent the form submission if the validation fails, something like this:

$('#elem').submit(function(e) {  if ($('#firstname').val().trim() == '') {    e.preventDefault();    alert('Firstname is empty');  }});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><form id="elem" autocomplete="on">  First Name:  <br>  <input type="text" name="firstname" id="firstname" placeholder="Enter the first name" pattern="[A-Za-z\-]+" maxlength="25"><br>  <input type="submit" id="submit" value="Submit" /></form>

if (inp.val().length > 0) {
    // do something
}