• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 1804
  • Last Modified:

Capture and cancel textarea keydown event in NS4 and up?

I'm trying to restrict the length of textarea input fields in JavaScript. No problem in IE but Netscape is giving me grief - seems to be ignoring the event entirely. I need to cancel the event before it occurs so new text is not added to the textarea. I'd also like to ignore delete key, backspaces and arrow keys (i.e. only captureEvents that actually lengthen the textarea size). This also has to work with the Japanese character set.

so far...

<SCRIPT>
document.campaign_data_form.campaign_desc.captureEvents(Event.KEYDOWN);
document.campaign_data_form.campaign_desc.onkeydown = checkLength(document.campaign_data_form.campaign_desc,'Campaign Description',400);
</SCRIPT>

and...

function checkLength(field,desc,length) {
//used with keydown to limit the length of an input field
     //ignore delete, backspace and arrow keys
     if (!(self.event.keyCode == 8 ||
            self.event.keyCode == 46 ||              
            (self.event.keyCode >= 37 && self.event.keyCode <= 40)              
               )) {
          if (field.value.length >= length) {
               self.event.returnValue = false
               alert (desc + ' cannot be more than ' + length + ' characters ' + self.event.keyCode + ' ' + field.value.length);
               if (field.value.length > length) {
                    field.value = field.value.substr(0,length);
               }
               return false;
          } else {
               return true;
          }
     } else {
          return true;
     }
}

As usual, please post answers as comments so I can choose which answer fits best.
0
deal051298
Asked:
deal051298
  • 7
  • 4
1 Solution
 
nimaigCommented:
Try this. It does the same what you want. :

<HTML>
<HEAD>
<SCRIPT>
function checkMaxLength (textarea, evt, maxLength) {
  if (textarea.selected && evt.shiftKey)
    // ignore shift click for select
    return true;
  var allowKey = false;
  if (textarea.selected && textarea.selectedLength > 0)
    allowKey = true;
  else {
    var keyCode =
      document.layers ? evt.which : evt.keyCode;
    if (keyCode < 32 && keyCode != 13)
      allowKey = true;
    else          
      allowKey = textarea.value.length < maxLength;
  }
  textarea.selected = false;
  return allowKey;
}
function storeSelection (field) {
  if (document.all) {
    field.selected = true;
    field.selectedLength =
      field.createTextRange ?
        document.selection.createRange().text.length : 1;
  }
}
</SCRIPT>
</HEAD>
<BODY>
<FORM NAME="formName">
<TEXTAREA NAME="aTextArea" ROWS="2" COLS="10" WRAP="soft"
          ONKEYDOWN="return checkMaxLength(this, event, 5)"
          ONSELECT="storeSelection(this)"
></TEXTAREA>
</FORM>

</BODY>
</HTML>






0
 
deal051298Author Commented:
Doesn't work in Netscape which is the core problem...
0
 
nimaigCommented:
which version of Netscape r u using. I am using Netscape 4.7 and it works fine.
0
Ultimate Tool Kit for Technology Solution Provider

Broken down into practical pointers and step-by-step instructions, the IT Service Excellence Tool Kit delivers expert advice for technology solution providers. Get your free copy now.

 
deal051298Author Commented:
Netscape Communicator 4.08 which is part of the spec unfortunatly. Thanks.
0
 
deal051298Author Commented:
OK. I just tried your code as a test using minimal html and it worked in NS4.08.

If you give me a while I'll try and find out what prevents it working for me.
0
 
deal051298Author Commented:
OK. Here's some Netscape fun... try this in Netscape 4.x :

<html>
<head>
     <title>Untitled</title>
<script>
function checkMaxLength (textarea, evt, maxLength) {
 if (textarea.selected && evt.shiftKey)
   // ignore shift click for select
   return true;
 var allowKey = false;
 if (textarea.selected && textarea.selectedLength > 0)
   allowKey = true;
 else {
   var keyCode =
     document.layers ? evt.which : evt.keyCode;
   if (keyCode < 32 && keyCode != 13)
     allowKey = true;
   else          
     allowKey = textarea.value.length < maxLength;
 }
 textarea.selected = false;
 return allowKey;
}

function storeSelection (field) {
 if (document.all) {
   field.selected = true;
   field.selectedLength =
     field.createTextRange ?
       document.selection.createRange().text.length : 1;
 }
}
</script>
</head>

<body>
<form name="data_form" method=post>
<table width="100">
     <tr>
          <td>
               <textarea name="desc" rows="4" wrap="SOFT" onkeydown="return checkMaxLength(this, event, 10)" onselect="storeSelection(this)"></textarea>
          </td>
     </tr>
</table>
</form>
</body>
</html>

And then make it 100% (not 100) on the <table width="100">
0
 
deal051298Author Commented:
So doesn't like table width %'s or nested tables for that matter either...
0
 
deal051298Author Commented:
the worst thing is it's not even kicking off the event at all...
0
 
nimaigCommented:
Hey ... there seems to be some problem with Netscape ... never noticed it before.
0
 
deal051298Author Commented:
Netscape's full of these "quirks". For one I'm glad they lost the browser war - they've now pulled their head in and got their act together with standards support, etc. If we were all working with NS4.7x browsers the web would be crap.  Long way to go before they reach IE=level reliability though (not that M$ are that hot)

Your code would work if it wasn't for bad Netscape programmers so the points are yours.

Cheers
0
 
nimaigCommented:
thanks :)
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Ultimate Tool Kit for Technology Solution Provider

Broken down into practical pointers and step-by-step instructions, the IT Service Excellence Tool Kit delivers expert advice for technology solution providers. Get your free copy now.

  • 7
  • 4
Tackle projects and never again get stuck behind a technical roadblock.
Join Now