Visualforce页面中的组件

17 Mar 2025 | 阅读 2 分钟

<apex: inlineEditSupport>是在VF页面上另一个最常用的组件，它为容器组件提供内联编辑支持。我们必须将此组件放在<apex: form>组件中才能使用它。

<apex: inlineEditSupport>组件只能是以下组件的子组件之一

<apex: repeat>
<apex: form>
<apex: outputField>
<apex: pageBlock>
<apex: pageBlockSection>
<apex: pageBlockTable>
<apex: dataList>
<apex: dataTable>

<apex: inlineEditSupport>组件在VF页面上具有以下属性

1. changedStyleClass

changedStyleClass是一个字符串类型属性，用于指定当字段的内容发生更改时，将应用于此组件的样式类的名称。

<apex: inlineEditSupport changedStyleClass= "className"></apex: inlineEditSupport>

2. disabled

disabled是一个布尔类型属性，用于指定是否启用内联编辑。默认情况下，其值设置为true。

语法

<apex: inlineEditSupport disabled="false" changedStyleClass= "className"></apex: inlineEditSupport>

3. event

event是一个字符串类型属性，用于指定标准DOM事件的名称。指定的DOM事件负责触发字段上的内联编辑。

语法

<apex: inlineEditSupport event="onchange" changedStyleClass= "className"></apex: inlineEditSupport>

4. hideOnEdit

hideOnEdit是一个对象类型属性，即，当激活内联编辑时，我们需要隐藏的按钮ID的逗号分隔列表。

语法

<apex: inlineEditSupport hideOnEdit= "btn1, btn2, btn3, …."></apex: inlineEditSupport>

5. id

id 是字符串类型的属性，即唯一的标识符，允许页面上的其他组件引用此组件。

语法

6. rendered

rendered是一个布尔类型属性，用于指定是否在页面上呈现此组件。布尔值true设置为此属性的默认值。

语法

7. resetFunction

resetFunction是一个字符串类型属性，用于指定可以在重置值时调用的JavaScript函数。

语法

<apex: inlineEditSupport resetFunction= "functionName"></apex: inlineEditSupport>

8. showOnEdit

showOnEdit是一个对象类型属性，即，激活内联编辑时，我们需要显示的按钮ID的逗号分隔列表。

语法

<apex: inlineEditSupport showonEdit= "btn1, btn2, btn3, …"></apex: inlineEditSupport>

让我们举个例子来了解如何在 VF 页面上使用此组件

ApexInlineEditSupportExample.vfp

<!-- apex page that shows the use of the inlineEditSupport component-->
<apex:page standardController="Account">
    <!-- user form -->.
    <apex: form >
        <!-- apex:pageBlock with inlineEdit mode -->
        <apex:pageBlock mode="inlineEdit">
            <!-- use apex:pageBlockButtons for creating Edit, Save and Cancel buttons-->
            <apex:pageBlockButtons >
                <apex:commandButton action="{!edit}" id="btnEdit" value="Edit Record"/>
                <apex:commandButton action="{!save}" id="btnSave" value="Save Record"/>
                <apex:commandButton onclick="resetInlineEdit()" id="btnCancel" value="Cancel"/>
            </apex:pageBlockButtons>
            <apex:pageBlockSection >
                <apex:outputField value="{!account.Name}">
                    <apex:inlineEditSupport showOnEdit="btnSave, btnCancel" 
                                            hideOnEdit="btnEdit" event="ondblclick" 
                                            changedStyleClass="changeClass" resetFunction="resetInlineEdit"/>
                </apex:outputField>
                <apex:outputField value="{!account.ParentId}"/>
                <apex:outputField value="{!account.Phone}"/>
            </apex:pageBlockSection>
        </apex:pageBlock>
    </apex: form>
</apex: page>

输出