CODEWITHSUNDEEP
javascripthtml
peachmeier
peachmeier

Reputation: 133

JavaScript: check if html p tag is empty

I have the following in my project:

function check() {
  var empt = document.getElementById('xyz1').value;

  if (empt == "") {
    alert("Please input a Value");
    return false;
  } else {
    return true;
  }
}
<a href="test.html" role="button" name="weiter" id="weiter" onclick="check();">Go</a>
<p id="xyz1"></p>

Something I am doing wrong. I always get to the page test.html. The check is not working. Is it even possible, to check if a p tag is empty?
Goal is, if there is nothing in the p tag to get an alert and if there is a string or number getting to the linked page test.html I would like to work in pure JavaScript (no jQuery).

Upvotes: 1

Views: 10327

Answers (2)

H&#252;seyin ASLIM
H&#252;seyin ASLIM

Reputation: 153

		function check() {
			event.preventDefault();
		  var empt = document.getElementById('xyz1').innerHTML;
		  if (empt == null || empt == "")
		  {
		    alert("Please input a Value");
		    return false;
		  }
		  else 
		  {
		  	return true; 
		  }
		}
<a href="test.html" role="button" name="weiter" id="weiter" onclick="check();">Go</a>
<p id="xyz1"></p>

Function must be event prevent default otherwise run href after on click event.

Another Method

onclick="return check()"


		function check() { 
		  var empt = document.getElementById('xyz1').innerHTML;
		  if (empt == null || empt == "")
		  {
		    alert("Please input a Value");
		    return false;
		  }
		  else 
		  {
		  	return true; 
		  }
		}
<a href="test.html" role="button" name="weiter" id="weiter" onclick="return check();">Go</a>
<p id="xyz1"></p>

Upvotes: -1

Ctznkane525
Ctznkane525

Reputation: 7465

It's innerHTML instead of value. Also, check for null.

function check() {

  var empt = document.getElementById('xyz1').innerHTML;
  if (empt == null || empt == "")
  {
  alert("Please input a Value");
  return false;
  }
  else 
  {
  return true; 
  }
  }
<a href="test.html" role="button" name="weiter" id="weiter" onclick="check();">Go</a>
<p id="xyz1"></p>

Upvotes: 3

Related Questions