This documentation is currently being moved to our new documentation site.
Please view or edit the documentation there, instead.
If you're looking for Fluid Project coordination, design, communication, etc, try the Fluid Project Wiki.
Dropdown Inline Edit API
Dropdown Inline Edit
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.
Creation
fluid.inlineEdit.dropdown(container, options);
Return: The Inline Edit component object.
Configuration
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.
This component is in Sneak Peek status
- Inline Edit Component Description
- Dropdown Inline Edit Component Description
- Inline Edit API
- Simple Text Inline Edit API
- Rich Text Inline Edit API
- About Infusion Components
Join the infusion-users mailing list and ask your questions there.
Pre-configuration
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.
| 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 |
| The dropdown-specific |
| The dropdown-specific |
Dependencies
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>