diff --git a/Client-Side Components/Client Scripts/field-character-counter/README.md b/Client-Side Components/Client Scripts/field-character-counter/README.md new file mode 100644 index 0000000000..d30b341b50 --- /dev/null +++ b/Client-Side Components/Client Scripts/field-character-counter/README.md @@ -0,0 +1,56 @@ +# Field Character Counter + +## Use Case +Provides real-time character count feedback for text fields in ServiceNow forms. Shows remaining characters with visual indicators to help users stay within field limits. + +## Requirements +- ServiceNow instance +- Client Script execution rights +- Text fields with character limits + +## Implementation +1. Create a new Client Script with Type "onChange" +2. Copy the script code from `script.js` +3. Configure the field name and character limit in the script +4. Apply to desired table/form +5. Save and test + +## Configuration +Edit these variables in the script: + +```javascript +var fieldName = 'short_description'; // Your field name +var maxLength = 160; // Your character limit +``` + +## Features +- Real-time character counting as user types +- Visual indicators: info (blue), warning (yellow), error (red) +- Shows "X characters remaining" or "Exceeds limit by X characters" +- Automatically clears previous messages + +## Common Examples +```javascript +// Short Description (160 chars) +var fieldName = 'short_description'; +var maxLength = 160; + +// Description (4000 chars) +var fieldName = 'description'; +var maxLength = 4000; + +// Work Notes (4000 chars) +var fieldName = 'work_notes'; +var maxLength = 4000; +``` + +## Message Thresholds +- **50+ remaining**: Info message (blue) +- **1-20 remaining**: Warning message (yellow) +- **Over limit**: Error message (red) + +## Notes +- Uses standard ServiceNow APIs: `g_form.showFieldMsg()` and `g_form.hideFieldMsg()` +- Create separate Client Scripts for multiple fields +- Works with all text fields and text areas +- Character count includes all characters (spaces, punctuation, etc.) \ No newline at end of file diff --git a/Client-Side Components/Client Scripts/field-character-counter/script.js b/Client-Side Components/Client Scripts/field-character-counter/script.js new file mode 100644 index 0000000000..42bd9ae34f --- /dev/null +++ b/Client-Side Components/Client Scripts/field-character-counter/script.js @@ -0,0 +1,22 @@ +function onChange(control, oldValue, newValue, isLoading) { + if (isLoading) return; + + // USER CONFIGURATION: Set field name and character limit + var fieldName = 'Description'; // Change to your field name + var maxLength = 80; // Change to your character limit + + var currentLength = newValue ? newValue.length : 0; + var remaining = maxLength - currentLength; + + // Clear any existing messages + g_form.hideFieldMsg(fieldName); + + // Show appropriate message based on remaining characters + if (remaining < 0) { + g_form.showFieldMsg(fieldName, 'Exceeds limit by ' + Math.abs(remaining) + ' characters', 'error'); + } else if (remaining <= 20) { + g_form.showFieldMsg(fieldName, remaining + ' characters remaining', 'warning'); + } else if (remaining <= 50) { + g_form.showFieldMsg(fieldName, remaining + ' characters remaining', 'info'); + } +} \ No newline at end of file