+ Start a Discussion
p1 force developerp1 force developer 

Date picker for a date input does not work when showHeader="false" in <apex:page>

Has any one experienced this issue with date input fields.

 

Date picker for a date input does not work when showHeader="false" in <apex:page>

 

<apex:page standardController="Account" showHeader="false">
<apex:form>
<apex:pageBlock title="Test Date Picker when showHeader is set to False" mode="edit">
<apex:pageBlockButtons>
<apex:commandButton action="{!save}" value="Save"/>
</apex:pageBlockButtons>
<apex:pageBlockSection columns="2">
<apex:inputField value="{!account.name}"/>
<apex:inputField value="{!account.SLAExpirationDate__c}"/>
</apex:pageBlockSection>
</apex:pageBlock>
</apex:form>
</apex:page>

 

If you set showHeader to "true" then date picker works fine for date input fields.

 

I have tried it in IE8 and Firefox and it shows the same behaviour.

 

 

Thanks

Best Answer chosen by Admin (Salesforce Developers) 
p1 force developerp1 force developer

It has been fixed by SFDC already

All Answers

joshbirkjoshbirk

I think this is because it requires the CSS from the normal headers to display properly.  If you turn showHeaders back on, you can get to the CSS files, and then replicate the CSS classes you need (I think they're commented as DatePicker) in you page with showHeaders turned off.

p1 force developerp1 force developer

Does this mean that the Date Picker in a visuaforce page will work only when showHeader is set to true.

 

 

To me it looks like a Visualforce bug.

 

 

mshelmanmshelman

We are experiencing a similar problem on VF page, where, when showHeader is false, some remnant of the Date picker is actually visible  near the bottom of the page.  It seems that the "standardStylesheets" attribute of the Page tag should take care of this but it does not seem to have any effect.

 

mike

p1 force developerp1 force developer

It has been fixed by SFDC already

This was selected as the best answer
Farhat MirzaFarhat Mirza

I found the fix for this. For reference us the below link

http://gotosalesforce.blogspot.com/2011/05/use-date-picker-while-sidebar-is-false.html

 

 Otherwise follow the below steps

 

Problem : when we make showHeader false then We cannot use Date-picker
so we can use following two methods:
1.First approach Use inline=1 in Url(of VF page at run time ) at last
 2. Second Approach Use JavaScript to hide Header and Side Bar without making these false
 Visual Page Code:

 


<apex:page showheader="true" sidebar="false" standardcontroller="Contact">
<apex:form>
<style type="text/css">
body #AppBodyHeader {
display: none;
}

</style>
<apex:pageblock>
<apex:outputlabel>
Your Date Birth :
</apex:outputlabel>
<apex:inputfield value="{!Contact.Birthdate}">
</apex:inputfield></apex:pageblock>
</apex:form>
</apex:page>