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.
deal051298Asked:
Who is Participating?
 
nimaigConnect With a Mentor Commented:
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
The new generation of project management tools

With monday.com’s project management tool, you can see what everyone on your team is working in a single glance. Its intuitive dashboards are customizable, so you can create systems that work for you.

 
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
All Courses

From novice to tech pro — start learning today.