www.webdeveloper.com
Results 1 to 14 of 14

Thread: Is there a way to check for the presence of text in a text area control in a form?

  1. #1
    Join Date
    Feb 2012
    Posts
    64

    Is there a way to check for the presence of text in a text area control in a form?

    I am doing some validation, and I want it so that if no comments are entered into a textarea control, then an alert message appears?

    My code so far is:

    Code:
    function Submit()
    {
    	var senderemailaddress=document.forms["contact"]["emailaddress"].value;
    	var sendername=document.forms["contact"]["name"].value;
    	var sendercomments=document.forms["contact"]["comments"].value;
    	
    	if(((sendername==null||sendername=="")&&(senderemailaddress==null||senderemailaddress=="")&&(sendercomments==null||sendercomments=="")))
    	{
    		alert("You have not entered any values for the Name, E-Mail Address or Comments fields. Enter in suitable values");
    		return false;
    	}
    	else if ((sendername==null||sendername=="")&&(senderemailaddress==null||senderemailaddress==""))
    	{
    		alert("You have not entered any values for the Name or E-Mail Address fields. Enter in suitable values");
    		return false;
    	}
        else if ((sendername==null||sendername=="")&&(sendercomments==null||sendercomments==""))
    	{
    		alert("You have not entered any values for the Name or Comments fields. Enter in suitable values");
    		return false;
    	}	
    	   else if ((senderemailaddress==null||senderemailaddress=="")&& (sendercomments==null||sendercomments==""))
    	{
    		alert("You have not entered any values for the E-Mail Address or Comments fields. Enter in suitable values");
    		return false;
    	}	
    
    																  
    }
    The sendercomments variable is being assigned the value of the text area control.

    Any help is appreciated

  2. #2
    Join Date
    Dec 2005
    Location
    FL
    Posts
    7,357

    Lightbulb

    I didn't keep much of your original post, but this should work (although untested without your HTML parts).
    Code:
    <script type="text/javascript">
    
    function Submit() {
      var flag = true;
      var errMsg = [];
    
    	var senderemailaddress=document.forms["contact"]["emailaddress"].value;
    	var sendername=document.forms["contact"]["name"].value;
    	var sendercomments=document.forms["contact"]["comments"].value;
    
      if (sendername == '') { flag = false;  errMsg.push('You have not entered a name.'); }
      if (senderemailaddress == '') { flag = false;  errMsg.push('You have not entered an email address.'); }
      if (sendercomments == '') { flag = false;  errMsg.push('You have not entered any comments.'); }
      if (!flag) { alert(errMsg.join('\n')); }
      return flag;  
    }
    </script>
    Note 1: Your checks for a blank field are not the best validation attempts. User could just enter 1 space and it would pass the tests. There are also better email validation scripts available on this forum.
    Note 2: You probably don't need the checks for null if you have initialized the HTML elements with values of ''

  3. #3
    Join Date
    Feb 2012
    Posts
    64
    Quote Originally Posted by JMRKER View Post
    I didn't keep much of your original post, but this should work (although untested without your HTML parts).
    Code:
    <script type="text/javascript">
    
    function Submit() {
      var flag = true;
      var errMsg = [];
    
    	var senderemailaddress=document.forms["contact"]["emailaddress"].value;
    	var sendername=document.forms["contact"]["name"].value;
    	var sendercomments=document.forms["contact"]["comments"].value;
    
      if (sendername == '') { flag = false;  errMsg.push('You have not entered a name.'); }
      if (senderemailaddress == '') { flag = false;  errMsg.push('You have not entered an email address.'); }
      if (sendercomments == '') { flag = false;  errMsg.push('You have not entered any comments.'); }
      if (!flag) { alert(errMsg.join('\n')); }
      return flag;  
    }
    </script>
    Note 1: Your checks for a blank field are not the best validation attempts. User could just enter 1 space and it would pass the tests. There are also better email validation scripts available on this forum.
    Note 2: You probably don't need the checks for null if you have initialized the HTML elements with values of ''
    I didn't seem to have much luck with what you suggested above :/

    No, I tell a lie, it seems to work

    I do have a question though, how would I implement it as an else if statment? (i.e. the whole if (!flag) and return flag are within the {} brackets of the else if statement?
    And how could I have validation so that the user cannot get past the checks by pressing Space once?
    Last edited by APD1993; 03-07-2012 at 11:02 AM.

  4. #4
    Join Date
    Dec 2005
    Location
    FL
    Posts
    7,357

    Exclamation

    Quote Originally Posted by APD1993 View Post
    ...
    I do have a question though, how would I implement it as an else if statment? (i.e. the whole if (!flag) and return flag are within the {} brackets of the else if statement?
    And how could I have validation so that the user cannot get past the checks by pressing Space once?
    What is your aversion to the (!flag) logic. Just don't understand it?
    Is it the use of the push() function that you are having trouble with?

    But if you need the if...else logic it can be changed.

    The single space problem can be bypassed as well, but it would still not stop
    entries like " qwerty ui op[" etc.

  5. #5
    Join Date
    Feb 2012
    Posts
    64
    Quote Originally Posted by JMRKER View Post
    What is your aversion to the (!flag) logic. Just don't understand it?
    Is it the use of the push() function that you are having trouble with?

    But if you need the if...else logic it can be changed.

    The single space problem can be bypassed as well, but it would still not stop
    entries like " qwerty ui op[" etc.
    It's mainly because I want it as a part of validation rules (i.e. if no fields are entered into, then display alert message 1 but if one field is left out, then display alert message 2 and so on) and I want there to be branches after it.

    I don't mind if the user chooses to enter something such as "qwerty ui op[" since even though it does not really make sense, it is still valid in the sense that it is in the correct format. As for whether it is "correct", that sounds more like verification rather than validation. How can I bypass the single space problem, bearing this in mind?

  6. #6
    Join Date
    Jul 2008
    Location
    urbana, il
    Posts
    2,787
    use the pattern attrib on your form input to enforce regexp-based validation rules.
    if you want one or more chars, it would be
    Code:
    pattern=".+"
    use a polyfill for old browsers, so you don't need to write any JavaScript.

  7. #7
    Join Date
    Feb 2012
    Posts
    64
    Quote Originally Posted by JMRKER View Post
    What is your aversion to the (!flag) logic. Just don't understand it?
    Is it the use of the push() function that you are having trouble with?

    But if you need the if...else logic it can be changed.

    The single space problem can be bypassed as well, but it would still not stop
    entries like " qwerty ui op[" etc.
    I discovered the WhiteSpace function, and that seems to have done the job

    Is it possible that it can be applied to the Comments textarea so that there are no spaces at the start of the comments?

  8. #8
    Join Date
    Dec 2005
    Location
    FL
    Posts
    7,357
    Show your particular "WhiteSpace" function and we can show you how to modify it.

    As for the individual messages, you could do something like this...
    Code:
    <script type="text/javascript">
    
    function Submit() {
      var flag = true;
    
    	var senderemailaddress=document.forms["contact"]["emailaddress"].value;
    	var sendername=document.forms["contact"]["name"].value;
    	var sendercomments=document.forms["contact"]["comments"].value;
    
      if (sendername == '') { flag = false;  alert('You have not entered a name.'); }  // add additional branch logic statements within { } sections here and/or below
      if (senderemailaddress == '') { flag = false;  alert('You have not entered an email address.'); }
      if (sendercomments == '') { flag = false;  alert('You have not entered any comments.'); }
    
      return flag;  
    }
    </script>
    Last edited by JMRKER; 03-07-2012 at 02:38 PM.

  9. #9
    Join Date
    Feb 2012
    Posts
    64
    Quote Originally Posted by JMRKER View Post
    Show your particular "WhiteSpace" function and we can show you how to modify it.
    My WhiteSpace function is

    Code:
    function hasWhiteSpace(s) {
    	reWhiteSpace = new RegExp(/^\s/);
    }
    However, I am not entirely sure that it works and that even if it did, I do not know how to apply it to multiple parts of an IF statement branch (i.e. if whitespace(1)==true && whitespace(2)==true && whitespace(3)==true
    {
    alert("You have not entered values for 1, 2 or 3");
    }

    :/

  10. #10
    Join Date
    Dec 2005
    Location
    FL
    Posts
    7,357
    Better WhiteSpace (at beginning of string) function
    Code:
    <script type="text/javascript">
    //<![CDATA[
    function hasWhiteSpace(s) {
      return /^\s/g.test(s);
    }
    
    alert(hasWhiteSpace('This has no whitespace at beginning'));
    alert(hasWhiteSpace(' This has whitespace at beginning'));
    
    //]]>
    </script>
    Remove the '^' character if you want to check for ANY white space character in the string.

  11. #11
    Join Date
    Feb 2012
    Posts
    64
    Quote Originally Posted by JMRKER View Post
    Better WhiteSpace (at beginning of string) function
    Code:
    <script type="text/javascript">
    //<![CDATA[
    function hasWhiteSpace(s) {
      return /^\s/g.test(s);
    }
    
    alert(hasWhiteSpace('This has no whitespace at beginning'));
    alert(hasWhiteSpace(' This has whitespace at beginning'));
    
    //]]>
    </script>
    Remove the '^' character if you want to check for ANY white space character in the string.
    You, kind sir, seem to have fixed my problem

    I should be OK for now, but if I have any difficulties, I will post in this topic or create one with a similar name

  12. #12
    Join Date
    Dec 2005
    Location
    FL
    Posts
    7,357

    Thumbs up

    Quote Originally Posted by APD1993 View Post
    You, kind sir, seem to have fixed my problem

    I should be OK for now, but if I have any difficulties, I will post in this topic or create one with a similar name
    You're most welcome.
    Happy to help.
    Good Luck!

  13. #13
    Join Date
    Feb 2012
    Posts
    64
    Relating to this, I was wondering if there was some way that I could get it so that if the user enters in anything but leaves an extra white space at the end (e.g. "Hello there "), that the same alert message as when an extra white space is added at the start of the text

    I am using this function:
    Code:
    function hasWhiteSpace(s) {
    	return /^\s/g.test(s);
    }

  14. #14
    Join Date
    Dec 2005
    Location
    FL
    Posts
    7,357

    Lightbulb

    You could use one of these:
    Code:
    function hasWhiteSpaceAtStart(s) { return /^\s/g.test(s); }  // looks at start of string
    function hasWhiteSpaceAtEnd(s) { return /$\s/g.test(s); }    // looks at end of strin
    function hasWhiteSpace(s) { return /\s/g.test(s); }          // looks anywhere in string

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles