I have a page message and I have a requirement that I want the text to be in red color.

I have written some javascript like this:

<Script>
    window.onload=func1;
    function func1()       
    {    
        document.getElementById('{!$Component.msg2}').style.color = "#ff0000";
        alert('{!$Component.msg2}');
    }  
</Script>

and the page message is like

<apex:outputPanel id="errordisplayPanel" >
    <apex:outputPanel Id="errorspanel">
        <input id="isDiscountCheckPrfmd" type="hidden" name="isDiscountCheckPrfmd" value="{!isDiscountCheckPrfmd}" />
        <c:Displayerror id="errordisplay" errorList="{!lstAllError}"  />                         
        <br/>  
    </apex:outputPanel>
    <div id="focusError"></div>                    
    <apex:pageMessages id="msg2" />
</apex:outputPanel> 

I don't know why its not working. But when I use the static id that I pick up using inspect element it's working.

It was like:

 document.getElementById("createSOheaderpage:newheaderform:newheaderpb:msg2:j_id63:j_id64:0:j_id65:j_id66:j_id68").style.color = "#ff0000";

Can someone please help me with this

Thanks in Advance

I have a page message and I have a requirement that I want the text to be in red color.

I have written some javascript like this:

<Script>
    window.onload=func1;
    function func1()       
    {    
        document.getElementById('{!$Component.msg2}').style.color = "#ff0000";
        alert('{!$Component.msg2}');
    }  
</Script>

and the page message is like

<apex:outputPanel id="errordisplayPanel" >
    <apex:outputPanel Id="errorspanel">
        <input id="isDiscountCheckPrfmd" type="hidden" name="isDiscountCheckPrfmd" value="{!isDiscountCheckPrfmd}" />
        <c:Displayerror id="errordisplay" errorList="{!lstAllError}"  />                         
        <br/>  
    </apex:outputPanel>
    <div id="focusError"></div>                    
    <apex:pageMessages id="msg2" />
</apex:outputPanel> 

I don't know why its not working. But when I use the static id that I pick up using inspect element it's working.

It was like:

 document.getElementById("createSOheaderpage:newheaderform:newheaderpb:msg2:j_id63:j_id64:0:j_id65:j_id66:j_id68").style.color = "#ff0000";

Can someone please help me with this

Thanks in Advance

I have a page message and i have a requirement like i want the text to be in red color.

I have written a java script like

<Script>
                    window.onload=func1;
                    function func1()       
                    {    
                        document.getElementById('{!$Component.msg2}').style.color = "#ff0000";
                        alert('{!$Component.msg2}');
                    }  
                </Script>

and the page message is like

<apex:outputPanel id="errordisplayPanel" >
                <apex:outputPanel Id="errorspanel">
                    <input id="isDiscountCheckPrfmd" type="hidden" name="isDiscountCheckPrfmd" value="{!isDiscountCheckPrfmd}" />
                     <c:Displayerror id="errordisplay" errorList="{!lstAllError}"  />
                     
                    <br/>  
                </apex:outputPanel>
                <div id="focusError"></div>
                
                <apex:pageMessages id="msg2" />
</apex:outputPanel> 

i dont know why its not working  .But when i use the static id that i pick up using inspect element its working.

It was like

document.getElementById("createSOheaderpage:newheaderform:newheaderpb:msg2:j_id63:j_id64:0:j_id65:j_id66:j_id68").style.color = "#ff0000";

Can someone please help me with this

Thanks in Advance

I have a page message and I have a requirement that I want the text to be in red color.

I have written some javascript like this:

<Script>
    window.onload=func1;
    function func1()       
    {    
        document.getElementById('{!$Component.msg2}').style.color = "#ff0000";
        alert('{!$Component.msg2}');
    }  
</Script>

and the page message is like

<apex:outputPanel id="errordisplayPanel" >
    <apex:outputPanel Id="errorspanel">
        <input id="isDiscountCheckPrfmd" type="hidden" name="isDiscountCheckPrfmd" value="{!isDiscountCheckPrfmd}" />
        <c:Displayerror id="errordisplay" errorList="{!lstAllError}"  />                          
        <br/>  
    </apex:outputPanel>
    <div id="focusError"></div>                     
    <apex:pageMessages id="msg2" />
</apex:outputPanel> 

I don't know why its not working. But when I use the static id that I pick up using inspect element it's working.

It was like:

 document.getElementById("createSOheaderpage:newheaderform:newheaderpb:msg2:j_id63:j_id64:0:j_id65:j_id66:j_id68").style.color = "#ff0000";

Can someone please help me with this

Thanks in Advance