diff --git a/Client-Side Components/Client Scripts/Display a Live Word Count for Description Field/README.md b/Client-Side Components/Client Scripts/Display a Live Word Count for Description Field/README.md new file mode 100644 index 0000000000..95c5f586f7 --- /dev/null +++ b/Client-Side Components/Client Scripts/Display a Live Word Count for Description Field/README.md @@ -0,0 +1,5 @@ +The script enhances a form field (specifically the description field) by: +-Adding a live word counter below the field. +-Visually warning the user if the word count exceeds 150 words. + +This client-side script, intended for use in a ServiceNow form (e.g., catalog item or incident form), dynamically appends a custom `
` element below the `description` field to display a real-time word count. It leverages the `g_form.getControl()` API to access the field's DOM element and attaches an `input` event listener to monitor user input. The script calculates the word count by splitting the input text using a regular expression (`\s+`) and updates the counter accordingly. It applies conditional styling to the counter (`green` if ≤150 words, `red` if >150), providing immediate visual feedback to the user to enforce input constraints. diff --git a/Client-Side Components/Client Scripts/Display a Live Word Count for Description Field/code.js b/Client-Side Components/Client Scripts/Display a Live Word Count for Description Field/code.js new file mode 100644 index 0000000000..127a1fcb51 --- /dev/null +++ b/Client-Side Components/Client Scripts/Display a Live Word Count for Description Field/code.js @@ -0,0 +1,11 @@ +function onChange(control, oldValue, newValue, isLoading, isTemplate) { + if (isLoading || newValue === oldValue) { + return; + } + + var wordCount = newValue.trim().split(/\s+/).length; + var message = 'Word Count: ' + (newValue ? wordCount : 0); + var messageType = (wordCount > 150) ? 'error' : 'info'; + + g_form.showFieldMsg('description', message, messageType); +}