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.
Results 1 to 10 of 10
  1. #1
    New to the CF scene
    Join Date
    Apr 2005
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Exclamation Javascript onKeyPress help

    Hey,

    I am currently coding a page, and when the user presses the enter key (keycode 13) on that page, I want the values inside all text boxes to be converted into upper case text.

    I wanted it to be set out as a function, something like this:

    <script language="JavaScript">
    function capitals() {
    if(event.keyCode=='13') { _______.value.toUpperCase(); }
    }
    </script>

    Could this be changed so that it updates all textboxes on the page.

    If the above makes no sense at all, its because I'm new to this!

  • #2
    Regular Coder
    Join Date
    Jan 2005
    Posts
    140
    Thanks
    0
    Thanked 0 Times in 0 Posts
    why don''t you just make is so that when the focus is off the textbox it's contents convert to caps. The enter button will not work if the user clicks the submit button and not the nter key.

  • #3
    Regular Coder
    Join Date
    Jan 2005
    Posts
    140
    Thanks
    0
    Thanked 0 Times in 0 Posts
    try this:

    Code:
    <input type="text" onBlur="javascript:this.value=this.value.toUpperCase();">

  • #4
    New to the CF scene
    Join Date
    Apr 2005
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Its part of a more complex script and the onFocus property is used and other property methods are used for this, to insert default values into other textboxes.

    Basically, this way would make it much easier for me to deal with.

  • #5
    New to the CF scene
    Join Date
    Apr 2005
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts
    the above suggestion would be fine, but do you know how I could do this where all of the textbox values are capitalised AFTER the user presses enter, and not leaves that field.

  • #6
    Regular Coder
    Join Date
    Jan 2005
    Posts
    140
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I have searched and have not been able to find a way to convert all the form elements to uppercase. you could on onChange instead of onBlur. You could write a script to make each of the form fields convert to uppercase individually, but I am not sure how to do it without writing long lines of code.

  • #7
    Regular Coder
    Join Date
    Jun 2002
    Location
    The Planet Earth Code Poet: True
    Posts
    282
    Thanks
    0
    Thanked 1 Time in 1 Post
    Does pressing enter trigger the form submital? If so just loop through the elements then:

    PHP Code:
    <script type="text/javascript">
    function 
    capitals(){
        var 
    txt=document.forms[0].elements;
        for(var 
    i=0i<txt.lengthi++){
            if(
    txt[i].type=="text")txt[i].value=txt[i].value.toUpperCase();
        }
        return 
    false// this is here to show how it works take it out in production
    }
    </script>
    <form onsubmit="return capitals()">
    <input type="text" />
    <input type="text" />
    <input type="text" />
    <input type="submit" />
    </form> 

  • #8
    New to the CF scene
    Join Date
    Apr 2005
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts
    No i don't want it to be done when the form is submitted. The form will not be submitted as it is not going anywhere.

    A PHP script within the same page will save the details which are changed back into the database. A popup will confirm when this is done and therefore the page will remain static.

    So, what I wanted to do was have all text boxes within the form have their contents capitalised once the user presses the enter key.

  • #9
    Regular Coder
    Join Date
    Jun 2002
    Location
    The Planet Earth Code Poet: True
    Posts
    282
    Thanks
    0
    Thanked 1 Time in 1 Post
    Then just trap the keys and run the same loop:

    PHP Code:
    <script type="text/javascript">
    document.onkeydown=function(e){
        if (!
    e) var window.event;
        var 
    code=e.keyCode e.keyCode:e.which;
        if(
    code==13){
        var 
    txt=document.forms[0].elements;
        for(var 
    i=0i<txt.lengthi++){
            if(
    txt[i].type=="text")txt[i].value=txt[i].value.toUpperCase();
        }
      }
    }
    </script>
    <form>
    <input type="text" />
    <input type="text" />
    <input type="text" />
    </form> 

  • #10
    New to the CF scene
    Join Date
    Apr 2005
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Works great! Thank you so much!


  •  

    Posting Permissions

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