Skip to main content

Notifications

Community site session details

Community site session details

Session Id :
Power Pages - Design & Build
Suggested answer

Form Field Background turns Blue how do I throw a Error Message if Background is Blue?

(1) ShareShare
ReportReport
Posted on by 516
I have a form, which this has Never been an issue prior, when the Wallet and or Saved Personal Data  popup causes the Text Box to turn blue.
 
 
I have turned off the items in Admin Center, however, I want to have an Error Message if the background of the Text Box is Blue.
 
I can not seem to find the Property item to have a message error saying  "Do not used the Wallet and or the Saved Personal Data."
 
 
How would I do this?
Categories:
  • Suggested answer
    SaiRT14 Profile Picture
    SaiRT14 1,941 Super User 2025 Season 1 on at
    Form Field Background turns Blue how do I throw a Error Message if Background is Blue?
    simple steps:
    • Set the OnSelect property or OnChange property of the text box
    • Create a label control for the error message and set its Visible property to display conditionally based on the background color.
     
  • Suggested answer
    Inogic Profile Picture
    Inogic 918 Super User 2025 Season 1 on at
    Form Field Background turns Blue how do I throw a Error Message if Background is Blue?
    Hi,
     
    We are a bit unclear about your requirements.

    However, as per our understanding, you wish to display a message when the background of the text box is blue.

    To achieve this functionality, We have to use custom JavaScript within the form.

    Navigate to the Power Pages Management > Basic Form > Advance Settings (Tab) > Custom Scripts (Section)



    Paste the below code in the Custom JavaScript section,

    Adjust the code with your background Text Box Color.

    $(document).ready(function() {
       
        // Select all input elements in the form
        var $inputBoxes = $('input[type="text"], input[type="number"], input[type="email"], input[type="tel"], textarea');

        // Create and append the error message element to each input box
        $inputBoxes.each(function() {
            $(this).after('<div class="error-message" style="color: red; display: none;">Do not use the Wallet and/or the Saved Personal Data.</div>');
        });

        // Function to toggle error message visibility based on background color
        function toggleErrorMessage($input) {
            var $errorMessage = $input.next('.error-message');
            if ($input.css('background-color') === 'rgb(0, 0, 255)') {
                $errorMessage.show();
            } else {
                $errorMessage.hide();
            }
        }

        // Attach events to input boxes
        $inputBoxes.on('input focus', function() {
            toggleErrorMessage($(this));
        }).on('blur', function() {
            if ($(this).css('background-color') !== 'rgb(0, 0, 255)') {
                $(this).next('.error-message').hide();
            }
        });
    });

    Please refer the result given below,



    Hope this helps.
     
    Thanks!
    Inogic Professional Services: Power Platform/Dynamics 365 CRM
    An expert technical extension for your techno-functional business needs
    Drop an email at crm@inogic.com 
    Service: https://www.inogic.com/services/ 
    Tips and Tricks: https://www.inogic.com/blog/ 
  • Jady Profile Picture
    Jady 108 on at
    Form Field Background turns Blue how do I throw a Error Message if Background is Blue?
    This might be a CSS issue. Try looking though the HTML & CSS with your browser's Developer Tools. It might be a CSS pseudo element such as :focus that applies the background-color of blue. 

Under review

Thank you for your reply! To ensure a great experience for everyone, your content is awaiting approval by our Community Managers. Please check back later.

Helpful resources

Quick Links

Microsoft Kickstarter Events…

Register for Microsoft Kickstarter Events…

Announcing Our 2025 Season 1 Super Users!

A new season of Super Users has arrived, and we are so grateful for the daily…

Announcing Forum Attachment Improvements!

We're excited to announce that attachments for replies in forums and improved…

Leaderboard

#1
WarrenBelz Profile Picture

WarrenBelz 146,318 Most Valuable Professional

#2
RandyHayes Profile Picture

RandyHayes 76,287 Super User 2024 Season 1

#3
Pstork1 Profile Picture

Pstork1 65,111 Most Valuable Professional

Leaderboard

Featured topics