function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
IntegratorIntegrator 

Datepicker elements are rendered on Visualforce form with no command button

If I create the very simple Visualforce page below, some unwanted datepicker elements appear on the page. Specifically, the dropdowns for month & day, the days of the week, and the "Today" link.

 

<apex:page showHeader="false" sidebar="false">
    <apex:form >
        <apex:commandLink value="Save" />
    </apex:form>
</apex:page>

 

If I use a commandButton instead, the datepicker elements disappear:

 

<apex:page showHeader="false" sidebar="false">
    <apex:form >
        <apex:commandButton value="Save" />
    </apex:form>
</apex:page>

 

Looking into the generated HTML, the first page is missing several script and CSS references that the second page has. I'm guessing this is the problem, but why is this happening?

 

My current workaround is to add a hidden commandButton to the form (see below), but I'd rather not rely on this. Am I doing something wrong in the first example? Are others able to reproduce this?

 

<apex:page showHeader="false" sidebar="false">
    <apex:form >
    	<apex:commandLink value="Save" />
        <apex:commandButton value="Save" style="display:none;" />
    </apex:form>
</apex:page>

 

Best Answer chosen by Admin (Salesforce Developers) 
bob_buzzardbob_buzzard

If showheader is set to false, the standard style sheets don't get pulled in.  You should be able to correct this by specifying that the standard style sheets are required:

 

<apex:page showHeader="false" sidebar="false" standardstylesheets="true">

 

All Answers

bob_buzzardbob_buzzard

If showheader is set to false, the standard style sheets don't get pulled in.  You should be able to correct this by specifying that the standard style sheets are required:

 

<apex:page showHeader="false" sidebar="false" standardstylesheets="true">

 

This was selected as the best answer
IntegratorIntegrator

Thanks Bob. Adding that attribute includes style sheets that hide the datepicker elements.

 

I'm still curious why the datepicker HTML would be included on this page at all? I'm also curious what I should do if I want to use my own stylesheets and don't want to include (and have to override) the standard ones?

bob_buzzardbob_buzzard

If you have a date or datetime input field then the elements will be needed.  I've always assumed they get included when you have a form on the page. 

Bill TurnerBill Turner

I'm way late to this conversation, but the following css eliminates those extra elements:

 

#calMonthPicker,#calYearPicker,.dayOfWeek,.buttonBar{
display:none;
}