THURSDAY, FEBRUARY 09, 2012

Max Length on Large String Fields in Service-now.com

Thursday, 07 January, 2010 09:44 Written by Mark Stanger
10 Comments

S

tring fields typically aren’t anything to get too worked up over, but I’ve discovered a couple of cool tips on dealing with string fields in Service-now.com that might benefit somebody else at some point.

The first tip is to know what the difference is between a single-line text field and a multi-line text field in Service-now. It’s obvious when you look at them, but there are some details under the hood that you might not know about. The driver of these differences is the ‘Max Length’ value that you set on the dictionary entry for the string field. Any string field with a max length value less than or equal to 255 will be rendered as a single-line text field. As soon as you hit 256 or more characters for the max length, the field is changed to a multi-line text field.

The second tip is to understand what this does at the database level in a MySQL database. A field with a max length value less than or equal to 255 is designated as a ‘CHAR’ datatype in the database. The DB won’t accept a max length greater than what you specify for these fields.

As soon as your max length is 256 or more however, the field changes to a ‘VARCHAR’ datatype. The maximum length of one of these fields doesn’t have a direct correlation to the max length specified on the dictionary entry. There is a formula for where the max length ends for VARCHAR fields, but it’s typically so large that for all intents and purposes you can put as much information in one of these fields as you need.

The third tip is to understand what happens in the client-side interface for these fields. Any single-line field will be rendered as an ‘INPUT’ HTML element on the form. ‘INPUT’ elements have an attribute included called ‘maxlength’ that you can use to limit the number of characters that can be added to the field. Service-now uses the dictionary setting when it renders the HTML for these fields.

With a multi-line text field things work differently. These are rendered as a ‘TEXTAREA’ HTML element on the form. HTML doesn’t include a ‘maxlength’ attribute for these fields so you can input as many characters as you want into one of these fields. The only way to work around this HTML limitation is to set up a client script to limit the number of characters allowed.

Shown below are a couple of ‘onLoad’ client scripts that I’ve used before to force a maximum length for a multi-line text field in Service-now. Both are designed to work on the ‘comments’ field on any of the ‘Task’ tables.

The first is an example I came up with just for fun. It displays a counter text box that shows the number of characters left. It also changes the background color of the field at specified intervals. Probably a little bit overkill but it gives you a lot of possibilities. I actually had some sound effects with it at one point!



function onLoad() {
//Create the counter field and line break
var counterBreak=document.createElement('br');
var counter=document.createElement('input');
counter.id='counter';
counter.type='text';
counter.readOnly=true;
counter.size='4';
counter.maxlength='4';
counter.value='500';

//Create a text node to be a label for the counter
var counterLabel = document.createElement('text');
counterLabel.innerHTML=' characters left';

//Use the 'onkeyup' event to check the 'isMaxLength' function
//Get the control
var control = g_form.getControl('comments');
//Add the nodes to the form
var controlParent = control.parentNode;
controlParent.appendChild(counterBreak);
controlParent.appendChild(counter);
controlParent.appendChild(counterLabel);
//Set its onkeyup method
control.onkeyup = isMaxLength;
}

function isMaxLength() {
   var mLength=500;
   var control = g_form.getControl('comments');
   var countControl = gel('counter');
   if (control.value.length >= mLength){
      //If number of characters exceeds maxLength then trim the value
      control.value = control.value.substring(0, mLength);

      //Flash the label for the comments field red for 4 seconds and change field background color
      g_form.flash('new_call.comments', '#FF0000', -4);
      g_form.getControl('comments').style.backgroundColor='red';
   }
   // otherwise, update 'characters left' counter
   else{
      //Change the background color of the field depending on characters left
      if(control.value.length <= 200){
         g_form.getControl('comments').style.backgroundColor='';
      }
      if((control.value.length > 200) && (control.value.length <= 400)){
         g_form.getControl('comments').style.backgroundColor='yellow';
      }
      if(control.value.length > 400){
         g_form.getControl('comments').style.backgroundColor='orange';
      }
   }
   countControl.value = mLength - control.value.length;
}

Here’s a simplified example. It just shows an error message when the Max Length for the field is reached.



function onLoad() {
   //Use the 'onkeyup' event to check the 'isMaxLength' function
   //Get the control
   var control = g_form.getControl('comments');
   //Set its onkeyup method
   control.onkeyup = isMaxLength;
}

function isMaxLength(){
   var mLength=500;
   var control = g_form.getControl('comments');
   if (control.value.length > mLength){
      g_form.hideErrorBox('comments');
      g_form.showErrorBox('comments', 'You have reached the maximum character limit for this field.');
      control.value=control.value.substring(0,mLength);
   }
   else{
      g_form.hideErrorBox('comments');
   }
}
Tags:  ,
This entry was posted on Thursday, January 7th, 2010 at 9:44 am and is filed under Client scripts. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.

Comments

Posted On
Jan 08, 2010
Posted By
John Chapin

You rock — this is great. Thanks for this stuff!

Reply
Posted On
Jun 16, 2010
Posted By
Scott Hetzel

Could you require a minimum number of characters to be typed in a text box? I’ve searched but have not found an answer yet…

Thanks,

Scott

Reply
Posted On
Jun 16, 2010
Posted By
admin

You can. That would probably best be accomplished by using an ‘onSubmit’ client script on the table of your choice. This script sample should help.

function onSubmit() {
   //Require at least 10 characters in the 'Comments' field
   var mLength = 10;
   var control = g_form.getControl('comments');
   if(control.value.length < mLength){
      g_form.hideErrorBox('comments');
      g_form.showErrorBox('comments', 'You must type at least ' + mLength + ' characters in this field.');
      return false;
   }
   else{
      g_form.hideErrorBox('comments');
   }
}
Reply
Posted On
Jun 21, 2010
Posted By
Scott Hetzel

Hi Mark,

That works great! Thanks…

Scott

Reply
Posted On
Jun 20, 2011
Posted By
Priyanka

Hi Mark,

I am trying to reduce the width for a string in dictionary entry from 1000 to 200. But I am not able to..I tried disabling business rule “Dictionary Change Rationally” which prevents making string length shorter. But this too is not working.

Let me know if there is any way to do it.

Reply
Posted On
Jun 20, 2011
Posted By
Mark Stanger

That should be all you need to do. I just tested on the ServiceNow demo instance and it worked without issue. You should confirm that it works for you there and then open a ticket with support if you still can’t get it to work in your own instance.

Reply
Posted On
Jun 21, 2011
Posted By
Priyanka

Hi Mark,

Thanks for the info.

I tried in ServiceNow demo and it works fine.. but its still not working in my instance.. :-(

Reply
Posted On
Aug 09, 2011
Posted By
Derrick J Wippler

Here is a slightly more re-useable form.

function onLoad() {
   g_form.getControl('u_public_comments').onkeyup = function() { isMaxLength( 1000, 'u_public_comments' ) };
   g_form.getControl('description').onkeyup = function() { isMaxLength( 1000, 'description' ) };
}

function isMaxLength( length, control ){
   var control = g_form.getControl(control);
   if (control.value.length > length){
      g_form.hideErrorBox(control);
      g_form.showErrorBox(control, 'You have reached the maximum character limit for this field.');
      control.value=control.value.substring(0,length);
   }
   else{
      g_form.hideErrorBox(control);
   }
}
Reply
Posted On
Oct 04, 2011
Posted By
Louwee G

hi, this script was very useful, but i am having a hard time applying the same script on a different field on the same form.

I am trying to use this same script on 4 different fields on the same form, i have attempted to modify the script for the 2nd field but it cancels out the 1st script on the 1st field.

Field names are u_header1, u_header2.

thanks in advance.

Reply
Posted On
Oct 04, 2011
Posted By
Mark Stanger

I haven’t ever tried it with 2 fields on the same form but I think if you’re having issues it’s because you’ve to 2 counters with the same DOM ID. You’ll need to change the following lines so that they are unique for each counter you use…

counter.id=’counter’;

var countControl = gel(‘counter’);

You’ll also need to change every place in the script that references ‘comments’ to be the name of your field.

Reply

Leave a Reply


Notify me of followup comments via e-mail. You can also subscribe without commenting.

Latest Comments

  • Aric: Finally figured out what I was doing wrong, incase someone else wants to do this. Mark is correct about needing...
  • Mark Stanger: You’ll probably need at least 3 total ACLs then. You’ll need one...
  • Mark Stanger: Hey Paul, I assume you’re talking about ‘task_ci’, not ‘task_group. If so, the...
  • ND: Hi Mark, This is cool. How can I do same at the form level. I have created a slushbucket variable and I want to...