From 28e8e3de3c9804a0afe124e5159afb527c2193f9 Mon Sep 17 00:00:00 2001 From: Rajat Date: Thu, 2 Oct 2025 20:30:55 +0530 Subject: [PATCH 1/3] Add Client Script: Mandatory Field Highlighter with proper ServiceNow methods - Shows error messages for empty mandatory fields using g_form.showFieldMsg() - onLoad script highlights all mandatory fields on form load - onChange script template for real-time field validation - Uses explicit field names to avoid control property issues - Follows ServiceNow best practices without DOM manipulation - Includes clear documentation and usage examples --- .../Mandatory Field Highlighter/README.md | 44 +++++++++++++++++++ .../Mandatory Field Highlighter/onChange.js | 20 +++++++++ .../Mandatory Field Highlighter/script.js | 28 ++++++++++++ 3 files changed, 92 insertions(+) create mode 100644 Client-Side Components/Client Scripts/Mandatory Field Highlighter/README.md create mode 100644 Client-Side Components/Client Scripts/Mandatory Field Highlighter/onChange.js create mode 100644 Client-Side Components/Client Scripts/Mandatory Field Highlighter/script.js diff --git a/Client-Side Components/Client Scripts/Mandatory Field Highlighter/README.md b/Client-Side Components/Client Scripts/Mandatory Field Highlighter/README.md new file mode 100644 index 0000000000..b8218122aa --- /dev/null +++ b/Client-Side Components/Client Scripts/Mandatory Field Highlighter/README.md @@ -0,0 +1,44 @@ +# Mandatory Field Highlighter + +## Use Case / Requirement +Highlight mandatory fields that are empty by showing error messages, making it easier for users to identify which required fields need to be completed. + +## Solution +Two client scripts that work together: +1. **onLoad script**: Shows error messages for empty mandatory fields when form loads +2. **onChange script**: Updates error messages in real-time as users fill fields +3. Uses proper ServiceNow methods instead of DOM manipulation + +## Implementation +1. **Create onLoad script**: + - New Client Script, Type: onLoad + - Copy code from `script.js` + - Apply to desired table + +2. **Create onChange script(s)**: + - New Client Script, Type: onChange + - Copy code from `onChange.js` + - **Important**: Replace `'FIELD_NAME'` with actual field name (e.g., 'priority') + - Create separate onChange scripts for each mandatory field you want to validate + - Set the "Field name" in the client script form to the specific field + +## Files +- `script.js`: onLoad client script for initial highlighting +- `onChange.js`: onChange template script for real-time updates + +## Example Usage +For priority field onChange script: +```javascript +var fieldName = 'priority'; // Replace FIELD_NAME with 'priority' +``` + +For category field onChange script: +```javascript +var fieldName = 'category'; // Replace FIELD_NAME with 'category' +``` + +## Notes +- Uses `g_form.showFieldMsg()` and `g_form.hideFieldMsg()` methods +- Follows ServiceNow best practices (no DOM manipulation) +- Works with standard ServiceNow forms +- Create one onChange script per mandatory field for best results \ No newline at end of file diff --git a/Client-Side Components/Client Scripts/Mandatory Field Highlighter/onChange.js b/Client-Side Components/Client Scripts/Mandatory Field Highlighter/onChange.js new file mode 100644 index 0000000000..85a0b31cc6 --- /dev/null +++ b/Client-Side Components/Client Scripts/Mandatory Field Highlighter/onChange.js @@ -0,0 +1,20 @@ +function onChange(control, oldValue, newValue, isLoading) { + if (isLoading) { + return; + } + + // This onChange script should be applied to specific mandatory fields + // Replace 'FIELD_NAME' with the actual field name you want to validate + // Example: For priority field, replace with 'priority' + var fieldName = 'FIELD_NAME'; // TODO: Replace with actual field name + + if (g_form.isMandatory(fieldName)) { + if (!newValue || newValue === '') { + // Show error message for empty mandatory field + g_form.showFieldMsg(fieldName, 'This field is required', 'error'); + } else { + // Hide error message when field is filled + g_form.hideFieldMsg(fieldName); + } + } +} \ No newline at end of file diff --git a/Client-Side Components/Client Scripts/Mandatory Field Highlighter/script.js b/Client-Side Components/Client Scripts/Mandatory Field Highlighter/script.js new file mode 100644 index 0000000000..98889fa14a --- /dev/null +++ b/Client-Side Components/Client Scripts/Mandatory Field Highlighter/script.js @@ -0,0 +1,28 @@ +function onLoad() { + // Highlight mandatory fields that are empty using proper ServiceNow methods + highlightMandatoryFields(); + + function highlightMandatoryFields() { + var allFields = g_form.getFieldNames(); + + for (var i = 0; i < allFields.length; i++) { + var fieldName = allFields[i]; + + // Check if field is mandatory and visible + if (g_form.isMandatory(fieldName) && g_form.isVisible(fieldName)) { + var fieldValue = g_form.getValue(fieldName); + + if (!fieldValue || fieldValue === '') { + // Show warning message for empty mandatory fields + g_form.showFieldMsg(fieldName, 'This field is required', 'error'); + } else { + // Clear any existing field messages + g_form.hideFieldMsg(fieldName); + } + } + } + } + + // Store function globally so onChange scripts can call it + window.updateMandatoryHighlighting = highlightMandatoryFields; +} \ No newline at end of file From c6759aa0182f27ec21ba5b42fa5d3c1ec231785b Mon Sep 17 00:00:00 2001 From: Rajat Date: Thu, 2 Oct 2025 21:34:01 +0530 Subject: [PATCH 2/3] removed onChange.js and simplified the script --- .../Mandatory Field Highlighter/README.md | 55 +++++++------------ .../Mandatory Field Highlighter/onChange.js | 20 ------- .../Mandatory Field Highlighter/script.js | 38 ++++++------- 3 files changed, 35 insertions(+), 78 deletions(-) delete mode 100644 Client-Side Components/Client Scripts/Mandatory Field Highlighter/onChange.js diff --git a/Client-Side Components/Client Scripts/Mandatory Field Highlighter/README.md b/Client-Side Components/Client Scripts/Mandatory Field Highlighter/README.md index b8218122aa..6d51de7015 100644 --- a/Client-Side Components/Client Scripts/Mandatory Field Highlighter/README.md +++ b/Client-Side Components/Client Scripts/Mandatory Field Highlighter/README.md @@ -1,44 +1,27 @@ # Mandatory Field Highlighter -## Use Case / Requirement -Highlight mandatory fields that are empty by showing error messages, making it easier for users to identify which required fields need to be completed. +## Use Case +Provides visual feedback for empty mandatory fields on ServiceNow forms by showing error messages when the form loads. Helps users quickly identify which required fields need to be completed. -## Solution -Two client scripts that work together: -1. **onLoad script**: Shows error messages for empty mandatory fields when form loads -2. **onChange script**: Updates error messages in real-time as users fill fields -3. Uses proper ServiceNow methods instead of DOM manipulation +## Requirements +- ServiceNow instance +- Client Script execution rights +- Forms with mandatory fields ## Implementation -1. **Create onLoad script**: - - New Client Script, Type: onLoad - - Copy code from `script.js` - - Apply to desired table +1. Create a new Client Script with Type "onLoad" +2. Copy the script code from script.js +3. Apply to desired table/form +4. Save and test on a form with mandatory fields -2. **Create onChange script(s)**: - - New Client Script, Type: onChange - - Copy code from `onChange.js` - - **Important**: Replace `'FIELD_NAME'` with actual field name (e.g., 'priority') - - Create separate onChange scripts for each mandatory field you want to validate - - Set the "Field name" in the client script form to the specific field - -## Files -- `script.js`: onLoad client script for initial highlighting -- `onChange.js`: onChange template script for real-time updates - -## Example Usage -For priority field onChange script: -```javascript -var fieldName = 'priority'; // Replace FIELD_NAME with 'priority' -``` - -For category field onChange script: -```javascript -var fieldName = 'category'; // Replace FIELD_NAME with 'category' -``` +## Features +- Shows error messages under empty mandatory fields on form load +- Uses proper ServiceNow client scripting APIs +- No DOM manipulation or unsupported methods +- Lightweight and focused functionality ## Notes -- Uses `g_form.showFieldMsg()` and `g_form.hideFieldMsg()` methods -- Follows ServiceNow best practices (no DOM manipulation) -- Works with standard ServiceNow forms -- Create one onChange script per mandatory field for best results \ No newline at end of file +- Uses g_form.showFieldMsg() method to display error messages +- Only runs on form load - no real-time updates +- Works with all mandatory fields automatically +- Simple single-script solution \ No newline at end of file diff --git a/Client-Side Components/Client Scripts/Mandatory Field Highlighter/onChange.js b/Client-Side Components/Client Scripts/Mandatory Field Highlighter/onChange.js deleted file mode 100644 index 85a0b31cc6..0000000000 --- a/Client-Side Components/Client Scripts/Mandatory Field Highlighter/onChange.js +++ /dev/null @@ -1,20 +0,0 @@ -function onChange(control, oldValue, newValue, isLoading) { - if (isLoading) { - return; - } - - // This onChange script should be applied to specific mandatory fields - // Replace 'FIELD_NAME' with the actual field name you want to validate - // Example: For priority field, replace with 'priority' - var fieldName = 'FIELD_NAME'; // TODO: Replace with actual field name - - if (g_form.isMandatory(fieldName)) { - if (!newValue || newValue === '') { - // Show error message for empty mandatory field - g_form.showFieldMsg(fieldName, 'This field is required', 'error'); - } else { - // Hide error message when field is filled - g_form.hideFieldMsg(fieldName); - } - } -} \ No newline at end of file diff --git a/Client-Side Components/Client Scripts/Mandatory Field Highlighter/script.js b/Client-Side Components/Client Scripts/Mandatory Field Highlighter/script.js index 98889fa14a..5cb6b0241a 100644 --- a/Client-Side Components/Client Scripts/Mandatory Field Highlighter/script.js +++ b/Client-Side Components/Client Scripts/Mandatory Field Highlighter/script.js @@ -1,28 +1,22 @@ function onLoad() { - // Highlight mandatory fields that are empty using proper ServiceNow methods - highlightMandatoryFields(); + // Get all field names on the form + var fieldNames = g_form.getFieldNames(); - function highlightMandatoryFields() { - var allFields = g_form.getFieldNames(); + // Check each field + for (var i = 0; i < fieldNames.length; i++) { + var fieldName = fieldNames[i]; - for (var i = 0; i < allFields.length; i++) { - var fieldName = allFields[i]; - - // Check if field is mandatory and visible - if (g_form.isMandatory(fieldName) && g_form.isVisible(fieldName)) { - var fieldValue = g_form.getValue(fieldName); - - if (!fieldValue || fieldValue === '') { - // Show warning message for empty mandatory fields - g_form.showFieldMsg(fieldName, 'This field is required', 'error'); - } else { - // Clear any existing field messages - g_form.hideFieldMsg(fieldName); - } - } + // Skip if field is not mandatory or not visible + if (!g_form.isMandatory(fieldName) || !g_form.isVisible(fieldName)) { + continue; + } + + // Get current field value + var value = g_form.getValue(fieldName); + + // Show error message if field is empty + if (!value || value === '') { + g_form.showFieldMsg(fieldName, 'This field is required', 'error'); } } - - // Store function globally so onChange scripts can call it - window.updateMandatoryHighlighting = highlightMandatoryFields; } \ No newline at end of file From 79078982b5f8bb959e670d0a5bb41e44ddc34a7e Mon Sep 17 00:00:00 2001 From: Rajat Date: Thu, 2 Oct 2025 22:01:10 +0530 Subject: [PATCH 3/3] added fields configuration by user instead of g_form.getFields method --- .../Mandatory Field Highlighter/README.md | 64 +++++++++++++++++-- .../Mandatory Field Highlighter/script.js | 12 ++-- 2 files changed, 66 insertions(+), 10 deletions(-) diff --git a/Client-Side Components/Client Scripts/Mandatory Field Highlighter/README.md b/Client-Side Components/Client Scripts/Mandatory Field Highlighter/README.md index 6d51de7015..0d875f0d55 100644 --- a/Client-Side Components/Client Scripts/Mandatory Field Highlighter/README.md +++ b/Client-Side Components/Client Scripts/Mandatory Field Highlighter/README.md @@ -11,17 +11,69 @@ Provides visual feedback for empty mandatory fields on ServiceNow forms by showi ## Implementation 1. Create a new Client Script with Type "onLoad" 2. Copy the script code from script.js -3. Apply to desired table/form -4. Save and test on a form with mandatory fields +3. **Customize the fieldsToCheck string** with your form's mandatory field names +4. Apply to desired table/form +5. Save and test on a form with mandatory fields + +## Configuration +Edit the `fieldsToCheck` variable to include your form's mandatory fields as a comma-separated string: + +```javascript +// Example configurations for different forms: + +// For Incident forms: +var fieldsToCheck = 'short_description,priority,category,caller_id,assignment_group'; + +// For Request forms: +var fieldsToCheck = 'short_description,requested_for,category,priority'; + +// For Change Request forms: +var fieldsToCheck = 'short_description,category,priority,assignment_group,start_date,end_date'; + +// For Problem forms: +var fieldsToCheck = 'short_description,category,priority,assignment_group'; + +// Custom fields (add as needed): +var fieldsToCheck = 'short_description,priority,u_business_justification,u_cost_center'; +``` ## Features - Shows error messages under empty mandatory fields on form load +- Easy configuration with comma-separated field names +- Automatically skips fields that don't exist on the form +- Only processes fields that are actually mandatory and visible - Uses proper ServiceNow client scripting APIs - No DOM manipulation or unsupported methods -- Lightweight and focused functionality + +## Common Field Names +- `short_description` - Short Description +- `priority` - Priority +- `category` - Category +- `caller_id` - Caller +- `requested_for` - Requested For +- `assignment_group` - Assignment Group +- `assigned_to` - Assigned To +- `state` - State +- `urgency` - Urgency +- `impact` - Impact +- `start_date` - Start Date +- `end_date` - End Date +- `due_date` - Due Date +- `location` - Location +- `company` - Company +- `department` - Department ## Notes - Uses g_form.showFieldMsg() method to display error messages -- Only runs on form load - no real-time updates -- Works with all mandatory fields automatically -- Simple single-script solution \ No newline at end of file +- Uses g_form.hasField() to safely check field existence (built into the safety checks) +- Only runs on form load - provides initial validation feedback +- Easy to customize for different forms by modifying the field list +- Compatible with all standard ServiceNow forms +- Lightweight and focused on essential functionality + +## Example Usage +For a typical incident form, simply change the configuration line to: +```javascript +var fieldsToCheck = 'short_description,priority,category,caller_id,assignment_group'; +``` +Save the Client Script and test on an incident form to see error messages appear under empty mandatory fields. \ No newline at end of file diff --git a/Client-Side Components/Client Scripts/Mandatory Field Highlighter/script.js b/Client-Side Components/Client Scripts/Mandatory Field Highlighter/script.js index 5cb6b0241a..457a1ca5e0 100644 --- a/Client-Side Components/Client Scripts/Mandatory Field Highlighter/script.js +++ b/Client-Side Components/Client Scripts/Mandatory Field Highlighter/script.js @@ -1,10 +1,14 @@ function onLoad() { - // Get all field names on the form - var fieldNames = g_form.getFieldNames(); + + // USER CONFIGURATION: Add field names you want to check (comma-separated) + var fieldsToCheck = 'short_description,priority,category,caller_id'; + + // Convert to array and process + var fieldArray = fieldsToCheck.split(','); // Check each field - for (var i = 0; i < fieldNames.length; i++) { - var fieldName = fieldNames[i]; + for (var i = 0; i < fieldArray.length; i++) { + var fieldName = fieldArray[i]; // Skip if field is not mandatory or not visible if (!g_form.isMandatory(fieldName) || !g_form.isVisible(fieldName)) {