标准salesforce css在动作函数

时间:2018-02-02 19:11:48

标签: css datepicker salesforce

我正在使用带有日期字段的自定义对象上的inputField处理visualforce页面,看起来像这样:

<apex:page id="myVisualForcePage" showheader="false" controller="myController">
    <apex:composition template="myTemplate">
        <apex:define name="body">
            <apex:outputpanel id="fullPage">
                <div class="form-group">

                    !A bunch of other stuff!

                    <label class="col-xs-4">My Date</label>
                    <div class="col-xs-8">
                        <apex:inputfield id="myDate" styleClass="form-control" value="{!myControllerObject.MyCustomDateField__c}"/>
                    </div>
                </div>
            </apex:outputpanel>
        </apex:define>
    <apex:composition>
</apex:page>

由于某种原因,在调用actionFunction之前,在页面加载时没有正确格式化datePicker。

这似乎是因为在调用之前,某些标准的salesforce css样式类不会在页面加载时加载。

当页面加载时,我们可以看到datePicker没有与之关联的标准elements.css类,并且没有到样式类的链接:

Datepicker Element

Datepicker Element Styling

CSS links before callout

在调用action函数之后,我们可以看到所有salesforce的标准css样式类都已加载,而datepicker现在已经加载了来自element.css的样式元素:

Newly loaded css styling links

New element styles for date picker

如果有人知道为什么会发生这种情况以及如何确保在页面加载时加载资源,我会非常感激!

作为更新,如果我显式加载以下资源资源,那么它将正常工作:

<link href="/sCSS/41.0/sprites/1516644206000/Theme3/default/gc/elements.css" type="text/css" class="user" rel="stylesheet"/>

但是,我不需要在其他页面上这样做,我想知道为什么?这可能是API的不同之处吗?

2 个答案:

答案 0 :(得分:0)

通过指定showHeader=false,您声明您不希望页面上有任何SF“开销”,包括样式表。

检查<apex:page>并考虑明确添加standardStylesheets="true" ...理论上它是默认值,但看起来你发现了一些有趣的行为(你)r。

  

standardStylesheets :一个布尔值,指定是否将标准Salesforce样式表添加到生成的页眉   如果showHeader属性设置为false。如果设置为true,则   标准样式表将添加到生成的页眉中。如果不   如果指定,则此值默认为true。通过将此设置为false,   需要Salesforce.com CSS的组件可能无法正确显示,   并且它们的样式可能会在不同版本之间发生变化。

答案 1 :(得分:0)

对于有此问题的任何人,请尝试更改visualforce页面的API版本。我发现v39可以正常工作,但是我在v41和v44上都有一个都存在此问题的页面。