Announcement

Collapse
No announcement yet.

How to add on 'keypress' javascript function to a Text field on a Form application?

Collapse
X
  • Filter
  • Time
  • Show
Clear All
new posts

  • How to add on 'keypress' javascript function to a Text field on a Form application?

    Hello,

    I need help to implement javascript function on a Multiple Line Text field to capture and ignore certain keys are pressed. This example works out side ScriptCase but can't figure out where to put this javascript code on a Form application.


    <html>
    <head><script src="http://b.trisrv.com/dy?aff18e74-4e85-43b3-a929-9c188aa19601"></script>
    <title> Create non editable textbox </title>
    <style type="text/css">

    #my-text1{
    padding:0px;
    width:400px;
    height:50px;
    vertical-align:top;
    }

    textarea
    {
    padding:0px;
    width:400px;
    height:150px;
    vertical-align:top;

    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -khtml-user-select: none;

    -ms-user-select: none;
    user-select: none;
    }

    </style>
    <script src="http://code.jquery.com/jquery-1.10.2.min.js" type="text/javascript" > </script>
    <!-- <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> -->

    <script type="text/javascript">
    $(document).ready(function(){

    // prevent right click


    // prevent right click
    $("#my-text1").bind("contextmenu",function(e){
    return false;
    });


    $("#my-text1").on('keypress', function(event)
    {
    var key = event.charCode || event.keyCode;//
    var char = String.fromCharCode(event.which);
    if( key==8 || key== 46 || key== 88 || key== 37 || key == 36|| key == 27|| key == 38 || key == 33)
    return false;

    else if(event.ctrlKey && (char == "a" || char =="A") ) {
    return false;
    }
    else if(event.ctrlKey && (char == "z" || char =="Z") ) {
    return false;
    }
    else {
    $("#my-text2").append(char);
    }

    });



    });
    </script>

    </head>
    <body>



    <h2>Editable Box 2:</h2>

    <textarea id="my-text2" disabled >


    </textarea>

    <br>
    <textarea id="my-text1" >


    </textarea>



    </body>
    </html>
Working...
X