How to Customize Footer level Color in Sales Order Screen

Hi ​@SaikrishnaVaddepalli 

You need to explore customization. I could not find any specific documentation/ instruction. Here are couple of related threads ( not specific to your thread ). 

https://asiablog.acumatica.com/index.php/2016/12/using-colors-in-acumatica/

https://www.acumatica.com/blog/acumatica-customization-theming-white-labeling/

Regards,

​@vkumar Thanks for sharing the thread links will try with this.

I too did not find any specific documentation/ instructions adding colors to the footer section. The above provided links will be useful when we wanted add the colors for the GRID and Form level fields.

Please raise a support case with Acumatica to check if this is feasible.

Hi ​@SaikrishnaVaddepalli , I recommend using JavaScript to change the color of the footer section. Below is a simple code snippet that may help you: 

$(document).ready(function(){
    $("#ctl00_phF_form_edFieldName").css("background-color", "yellow");
});

Replace #ctl00_phF_form_edFieldName with the actual ID of the field you want to modify.

Thank you ​@Naveen Boga ​@davidnavasardyan for providing the details.

Based on the specific logged-in user condition, I need to change the color of the footer section. I will try using JS, and if that doesn’t work, I will raise a support case with Acumatica.

Hello ​@SaikrishnaVaddepalli ,

You can try using the ​@davidnavasardyan suggestion of applying the color using jQuery function if it is not a concern of using scripts.

Good luck!

Thanks ​@SaikrishnaVaddepalli for sharing the solution.

​@SaikrishnaVaddepalli, To include the changes in the aspx might be tricky. You can try the following,

• You can edit the SO301000.aspx from the Pages folder of the website in you local
• Remove SO301000.aspx from the files.list in the root folder of the site
• Then from Files section the customization project, add the SO301000.aspx 

This step should place the aspx in other site but it will not work if you have customization project that modifies the SO301000.aspx. So in that case you have directly modify the aspx in the CstPublished folder. Good Luck.!

​@SaikrishnaVaddepalli 

Yes, you are right. It is a problem when trying to modify an ASPX file via a Generate Customization Script .

I would suggest moving your code to a separate .js file, which will keep your code much cleaner. Additionally, you can dynamically load the JavaScript file using PXJavaScript.

Here is an example of how you can use it:

<px:PXJavaScript 
    runat="server" 
    ID="CstSetFooterColorJavaScript"  
    IsStartupScript="False" 
    Script="window.addEventListener('load', () => { 
        const s = document.createElement('script'); 
        s.src = '../[YOUR_SCRIPT].js';  
        s.onload = () => { 
            if (typeof highlightAvailableForShipping=== 'function') { 
                highlightAvailableForShipping(); 
            } else { 
                console.error('highlightAvailableForShippingis not defined');  
            } 
        }; 
        s.onerror = () => console.error('Failed to load highlightAvailableForShippingis script:', s.src);  
        document.head.appendChild(s); 
    });" 
/>

And in your JavaScript file ([YOUR_SCRIPT].js), write the following code:

window.addEventListener('load', () => { 
    // Your code executes after the page has fully loaded 
});

This approach will ensure better code organization and maintainability. Let me know if you need further assistance!