Documentation for a historical release of Infusion: 1.3
Please view the Infusion Documentation site for the latest documentation.
If you're looking for Fluid Project coordination, design, communication, etc, try the Fluid Project Wiki.

Dropdown Inline Edit API

Owned by Anastasia Cheetham
Last updated: Apr 19, 2010 by Justin ObaraVersion comment
2 min read

The Dropdown Inline Edit is a specific integration of the Inline Edit component that uses a constrained field, i.e. it allows users to quickly select from a constrained list of choices.

fluid.inlineEdit.dropdown(container, options);

Return: The Inline Edit component object.

The Dropdown Inline Edit is a specific configuration of the Inline Edit component. Its API is fundamentally the same as the top-level Inline Edit API, but some of the options are pre-configured.

Status

This component is in Sneak Peek status

On This Page
See Also
Still need help?

Join the infusion-users mailing list and ask your questions there.

The configuration of the Dropdown Inline Edit is accomplished through a fluid.defaults object (for more information about component defaults, see Framework Functions#Defaults). These defaults are described below.

NOTE: If you override any of these defaults, the Dropdown Inline Edit may not function properly.

fluid.defaults("fluid.inlineEdit.dropdown", {
    applyEditPadding: false,
    blurHandlerBinder: fluid.inlineEdit.dropdown.blurHandlerBinder,
    editModeRenderer: fluid.inlineEdit.dropdown.editModeRenderer
});

These settings are described below.

applyEditPadding

Normally, a small padding is applied to the edit field when in edit mode. This is unnecessary for the Dropdown Inline Edit, so this value is set to false

blurHandlerBinder

The dropdown-specific blurHandlerBinder function binds a specialized blur handler to the component, to account for the fact that the activated dropdown consists of multiple active DOM elements.

editModeRenderer

The dropdown-specific editModeRenderer configures the component to use the dropdown selection box when in edit mode.

The Dropdown Inline Edit dependencies can be met by including the minified InfusionAll.js file and the jquery.selectbox.js plugininto the header of the HTML file:

<script type="text/javascript" src="InfusionAll.js"></script>
<script type="text/javascript" src="jquery.selectbox.js"></script>

Alternatively, the individual file requirements are:

<script type="text/javascript" src="lib/jquery/core/js/jquery.js"></script>
<script type="text/javascript" src="lib/jquery/ui/js/jquery.ui.core.js"></script>
<script type="text/javascript" src="lib/jquery/plugins/tooltip/js/jquery.tooltip.js"></script>
<script type="text/javascript" src="jquery.selectbox.js"></script>
<script type="text/javascript" src="framework/core/js/jquery.keyboard-a11y.js"></script>
<script type="text/javascript" src="framework/core/js/Fluid.js"></script>
<script type="text/javascript" src="components/inlineEdit/js/InlineEdit.js"></script>
<script type="text/javascript" src="components/inlineEdit/InlineEditIntegrations.js"></script>