Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Page 1 of 2 12 LastLast
Results 1 to 15 of 20
  1. #1
    New Coder
    Join Date
    Jun 2012
    Posts
    14
    Thanks
    3
    Thanked 0 Times in 0 Posts

    Question how do I check that a text field only contains the letter x

    I am trying to get javascript to submit a form only if the user has entered a capital X in a text box (named "tictactoe3"). I only want the form to submit if the character enter is an X. I do not want it to submit if any other character is entered or if more than one character is entered or if the field is left blank.

  • #2
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,893
    Thanks
    202
    Thanked 2,528 Times in 2,506 Posts
    Quote Originally Posted by jc@rcc View Post
    I am trying to get javascript to submit a form only if the user has entered a capital X in a text box (named "tictactoe3"). I only want the form to submit if the character enter is an X. I do not want it to submit if any other character is entered or if more than one character is entered or if the field is left blank.
    Code:
    <form>
    <input type = "text" name = "tictactoe3" size = "1" maxlength = "1" >
    <input type = "button" value = "Submit the form" onclick = "check4X()">
    </form>
    
    <script type = "text/javascript">
    function check4X() {
    var val = document.forms[0].tictactoe3.value;
    if (val === "X") {
    document.forms[0].submit();
    }
    else {
    alert ("You must place an X in the box before you can submit the form");
    document.forms[0].tictactoe3.value = "";
    return false;
    }
    
    }
    </script>
    Celebrity: It's Catch 22. You need to nip it in the bud before it bites you in the backside.
    Interviewer: Yes, it's cat and mouse, isn't it? - Al-Jazeera English.

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.

  • Users who have thanked Philip M for this post:

    jc@rcc (06-30-2012)

  • #3
    New Coder
    Join Date
    Jun 2012
    Posts
    14
    Thanks
    3
    Thanked 0 Times in 0 Posts
    Thanks for the reply.

    I should have known the maxlength = "1" and that stops them being able to enter more than one character

    But the javascript doesnt work. All it does is return the alert whether the text field is empty or if anything is entered.

    And why the three =
    Quote Originally Posted by Philip M View Post
    if (val === "X")
    I've tried it with two = but it still does thje same.

  • #4
    New Coder
    Join Date
    Jun 2012
    Posts
    14
    Thanks
    3
    Thanked 0 Times in 0 Posts
    Here is my javascript so far, and it all works:-
    Code:
    function validateForm()
    {
    	var x=document.forms["Contact"]["leavethisblank"].value
    	var y=document.forms["Contact"]["hummie"].checked
    	var t1=document.forms["Contact"]["tictactoe1"].value
    	var t2=document.forms["Contact"]["tictactoe2"].value
    	var t4=document.forms["Contact"]["tictactoe4"].value
    	var t5=document.forms["Contact"]["tictactoe5"].value
    	if (x==0 && y == false && t1==0 && t2==0 && t4==0 && t5==0)
       	return true
    	else
    	return false	
    }
    "leavethisblank" is a hidden field and the form only submits if it is left empty.
    "hummie" is a checkbox and the form only submits if it is unchecked.
    "tictactoe1,2,4 &5" are fields in a tictactoe game and the form only submits if they are left empty.
    "tictactoe3" is another field in the tictactoe game that I want users to put an X in order to make a line of three. I only want the form to submit if an X is inserted in this field.

  • #5
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,893
    Thanks
    202
    Thanked 2,528 Times in 2,506 Posts
    Quote Originally Posted by jc@rcc View Post
    Thanks for the reply.

    I should have known the maxlength = "1" and that stops them being able to enter more than one character

    But the javascript doesnt work. All it does is return the alert whether the text field is empty or if anything is entered.

    And why the three =

    I've tried it with two = but it still does thje same.
    Sorry, the script works just fine for me. The alert is shown if anything except a capital letter X (or nothing at all) is entered into the box. That is what you asked for. If a capital X is entered the form is submitted (to what server-side script???)

    === is stricty equality - value and type. == will work fine here as well. If the required value was a number then 1==1 but 1 != "1".

    You say "leavethisblank" is a hidden field and the form only submits if it is left empty. But you are testing for a value of 0. Same with other fields. So it cannot possibly work.
    BTW, 0 is not the same as O.

    Your code is sloppy - you have left out the semi-colons at the end of each line and have not used braces around your if/else.
    Last edited by Philip M; 06-30-2012 at 09:11 AM.

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.

  • Users who have thanked Philip M for this post:

    jc@rcc (06-30-2012)

  • #6
    New Coder
    Join Date
    Jun 2012
    Posts
    14
    Thanks
    3
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Philip M View Post
    Sorry, the script works just fine for me.
    I've tried it on its own in the html and on its own in a seperate javascript file linked to the html. I'll try it on a form with only the one field to see if its anything to do with the rest of my form.

    Quote Originally Posted by Philip M View Post
    You say "leavethisblank" is a hidden field and the form only submits if it is left empty. But you are testing for a value of 0. Same with other fields. So it cannot possibly work.
    BTW, 0 is not the same as O.
    It works for me! If I put anything in these fields the form does not submit.

    Quote Originally Posted by Philip M View Post
    to what server-side script???
    At the moment the page is not live (it is part of a complete site revamp I am working on). At the moment when the form submits it redirects to a Thank You page and sends an email via my existing sites server. I need to work on the server side validation of the form, but haven't got a clue how to do this yet!

    Quote Originally Posted by Philip M View Post
    Your code is sloppy - you have left out the semi-colons at the end of each line and have not used braces around your if/else.
    I'll tidy it up a bit!

  • #7
    New Coder
    Join Date
    Jun 2012
    Posts
    14
    Thanks
    3
    Thanked 0 Times in 0 Posts
    OK. So I've put it all into a new html page and it works!!! Wonder what I'm doing wrong when I try to put it into my form then?

  • #8
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,893
    Thanks
    202
    Thanked 2,528 Times in 2,506 Posts
    Quote Originally Posted by jc@rcc View Post
    OK. So I've put it all into a new html page and it works!!! Wonder what I'm doing wrong when I try to put it into my form then?
    Who can tell?

    "It works for me! If I put anything in these fields the form does not submit." No. It does not submit because of another error which I have pointed out.
    Last edited by Philip M; 06-30-2012 at 10:53 AM.

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.

  • Users who have thanked Philip M for this post:

    jc@rcc (06-30-2012)

  • #9
    New Coder
    Join Date
    Jun 2012
    Posts
    14
    Thanks
    3
    Thanked 0 Times in 0 Posts

    Thumbs up

    TA DAH!!! It works!!

    Code:
    function validateForm()
    {
    	var x=document.forms["Contact"]["leavethisblank"].value;
    	var y=document.forms["Contact"]["hummie"].checked;
    	var t1=document.forms["Contact"]["tictactoe1"].value;
    	var t2=document.forms["Contact"]["tictactoe2"].value;
    	var t3=document.forms["Contact"]["tictactoe3"].value;
    	var t4=document.forms["Contact"]["tictactoe4"].value;
    	var t5=document.forms["Contact"]["tictactoe5"].value;
    	if (x==0 && y == false && t1==0 && t2==="x" && t3==0 && t4==0 && t5==0){
       	return true;}
    else {
    return false;}
    }
    I've moved things about a bit and its now "tictactoe2" that needs an "x" in it.

    The problem had something to do with onsubmit in the form tag rather than onclick in the submit button tag. It also had something to do with trying to replace the letter entered with a capital - have changed it to remain lower case and to look for a lower case "x".

    Thanks. Now all I need to do is learn how to do the servere side bit.
    Last edited by jc@rcc; 06-30-2012 at 11:50 AM.

  • #10
    Regular Coder LearningCoder's Avatar
    Join Date
    Jan 2011
    Location
    The Pleiades
    Posts
    918
    Thanks
    76
    Thanked 29 Times in 29 Posts
    Ah I wasn't aware you could use === in JavaScript....

    Is it a new feature? :S

    Regards,

    LC.

  • #11
    New Coder
    Join Date
    Jun 2012
    Posts
    14
    Thanks
    3
    Thanked 0 Times in 0 Posts
    And heres how this bit of the form will look when it goes live:

    http://www.wellingtont2905.co.uk/spam.html

  • #12
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,893
    Thanks
    202
    Thanked 2,528 Times in 2,506 Posts
    Quote Originally Posted by LearningCoder View Post
    Ah I wasn't aware you could use === in JavaScript....

    Is it a new feature? :S

    Regards,

    LC.
    No, not at all a new feature.

    For more info see http://stackoverflow.com/questions/3...operator-i-use
    Last edited by Philip M; 06-30-2012 at 12:58 PM.

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.

  • #13
    New Coder
    Join Date
    Jun 2012
    Posts
    14
    Thanks
    3
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Philip M View Post
    (to what server-side script???)
    So any clues how I do the server side script? I am completely new at this. Or any idea where I can learn how to do it?

  • #14
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,893
    Thanks
    202
    Thanked 2,528 Times in 2,506 Posts
    Quote Originally Posted by jc@rcc View Post
    So any clues how I do the server side script? I am completely new at this. Or any idea where I can learn how to do it?
    I think you are under-estimating what is required here. One does not learn a server-side language in a few days or a few weeks.

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.

  • #15
    Regular Coder
    Join Date
    May 2012
    Location
    France
    Posts
    224
    Thanks
    0
    Thanked 32 Times in 30 Posts
    There is no need of PHP, form or to detext X, to play TicTacToe ! Javascript is enough, see this page.


  •  
    Page 1 of 2 12 LastLast

    Posting Permissions

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