< Back
Document Subject: Limit a web text field and show how many characters are left
Hint Short Cut: Add this to your code & documentation to help you find this page.
http://#WebTextFieldLimit or http://A555F9/nn.nsf/ByAlias/WebTextFieldLimit

You may want to limit the amount of characters a user can enter into a web page text field.




One way to do this is to use the keydown event in javascript.

Put this in the HTML other  properties box of the editable field "fl_Comments".

onKeyDown="limitText(this.form.fl_Comments,this.form.countdown,34);"   onKeyUp="limitText(this.form.fl_Comments,this.form.countdown,34);" maxlength="34"

 

Put this function in the JSHeader  section:

function limitText(limitField, limitCount, limitNum) {
 if (limitField.value.length > limitNum) {
  limitField.value = limitField.value.substring(0, limitNum);
 } else {
  limitCount.value = limitNum - limitField.value.length;
 }
}

Have an editable field called limitField with

default formula:

@Text(34-@Length(fl_comments))

and style:  

border:0px;

 

NB Using keypress event has weird results when using delete key so beware.