Check If Input is empty JQuery

Question

Hello, There are simple problem in my code, I've put myself as a user, let's assume that if the user click on the space button (in keyboard), So What is the solution.

Here my simple code:

var name = $('input#name').val(); // get the value of the input field
if(name == "" || name == " ") {
	$('#err-name').fadeIn('slow'); // show the error message
	error = true; // change the error state to true
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

Gabriele Petrioli · Accepted Answer · 2017-03-12 18:53:43Z

5

Use the $.trim function to remove spaces

var name = $.trim( $('input#name').val() ); // get the value of the input field
if(name == "") {
    $('#err-name').fadeIn('slow'); // show the error message
    error = true; // change the error state to true
}

answered Mar 12, 2017 at 18:53

Gabriele Petrioli

197k35 gold badges275 silver badges331 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

MoHamed HaSsn Over a year ago

Thank you mr.Gaby but I'd Like to know what this mean '$'?

Gabriele Petrioli Over a year ago

$ is the jQuery library object. (You are already using it)

MoHamed HaSsn Over a year ago

i Know that if i need select element I using $('CSS Selector') :) :) But I Don't Know what is the difference between $ and $('')

Gabriele Petrioli Over a year ago

@MoHamedHaSsn exactly. And jquery provides a method named trim that removes leading/trailing spaces from a string. To call that you use $.trim( <string here> )

MoHamed HaSsn Over a year ago

Thank you for helping me MR.Gaby

Neil · Accepted Answer · 2017-03-12 18:53:51Z

1

The .trim function in JavaScript removes leading and trailing spaces/new lines. So, if the user just spams space bar, the name.trim() will remove all leading/trailing spaces, resulting in "" and that equals "". Thus, your error code would show.

var name = $('input#name').val(); // get the value of the input field
if(name.trim() == "") {
    $('#err-name').fadeIn('slow'); // show the error message
    error = true; // change the error state to true
}

answered Mar 12, 2017 at 18:53

Neil

14.3k3 gold badges35 silver badges53 bronze badges

Collectives™ on Stack Overflow

Check If Input is empty JQuery

2 Answers 2

5 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

5 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related