Challenges with Passing caller_id Phone Number from UI Page to Script Include for OTP Verification

[naborowiak]

Hello ServiceNow Community,

I'm encountering a challenge with a feature I'm implementing, which involves sending an OTP (One Time Password) to either a personal or business phone number associated with the caller_id of an incident record. The process is facilitated through a custom UI Page and a Script Include, but I'm facing issues with correctly passing the phone number from the UI Page to the Script Include for the OTP sending process.

Current Implementation:

1. Script Include (VerifyCodeAjax): This Script Include is intended to receive a phoneType (personal or business), fetch the corresponding phone number from the user record (caller_id on Incident), format it, and send an OTP using Twilio.

2. UI Page: The UI Page allows users to select between their personal and business phone numbers (fetched and displayed on the page) and initiates the OTP sending process via a GlideAjax call to the VerifyCodeAjax Script Include.

Issue Experienced: The process fails to correctly identify and send the OTP to the selected phone number. Specifically, when "Personal" is selected, the system still attempts to send the OTP to the "Business" phone number.

Script Include Snippet:

var VerifyCodeAjax = Class.create();
VerifyCodeAjax.prototype = Object.extendsObject(AbstractAjaxProcessor, {
    sendCode: function() {
        var phoneType = this.getParameter('sysparm_phone_type').toString().trim();
        // Logic to determine and format the phone number based on phoneType
        // Twilio API call to send the OTP
    },
    // Additional methods for verification...
});

UI Page Snippet:

<!-- Simplified HTML and JavaScript for brevity -->
<div class="sms-verification-container">
    <!-- Phone number selection and display logic -->
    <button onclick="sendConfirmCode();">Send Confirm Code</button>
</div>

<script>
function sendConfirmCode() {
    var selectedPhoneType = getSelectedPhoneNumber();
    var ga = new GlideAjax('VerifyCodeAjax');
    ga.addParam('sysparm_name', 'sendCode');
    ga.addParam('sysparm_phone_type', selectedPhoneType);
    ga.getXMLAnswer(function(answer) {
        alert(answer);
    });
}
</script>

Questions for the Community:

• How can I ensure that the correct phone number is passed from the UI Page to the Script Include based on the user's selection?
• Is there a recommended approach to debug or log the data flow between the UI Page and Script Include to identify where the discrepancy occurs?

Any insights, recommendations, or examples of similar implementations would be incredibly helpful.

Thank you for your assistance!