API Docs for:
Show:

Y.DataTable.EditorOptions.inlineAC Class

Inline Cell Editor "inlineAC"

This View configuration is used to setup an inline editor referenced as "inlineAC" composed of a simple inline-type cell editor which has the AutoComplete plugin attached to the input node.

Basic Usage:
   // Column definition
   { key:'degreeProgram', editor:"inlineAC",
     editorConfig:{

        // The following object is passed to "autocomplete" plugin when this
        //   editor is instantiated
        autocompleteConfig: {
           source:  [ "Bachelor of Science", "Master of Science", "PhD" ]
           on: {
               select: function(r){
                   var val = r.result.display;
                   this.editor.saveEditor(val);
               }
           }
        }
      }
   }
Standard Configuration

This inline editor creates a simple INPUT[type=text] control and positions it to match the underlying TD node. When the editor is first instantiated, the Y.Plugin.AutoComplete is connected to the INPUT using the autocompleteConfig object passed in by the user.

This editor View instance is attached to the autocomplete plugin as static property "editor". An "on:select" listener is defined in the configs to take action on saving the selected item from the autocomplete.

The configuration {Object} for this cell editor View is predefined as;

    Y.DataTable.EditorOptions.inlineAC = {
         BaseViewClass:  Y.DataTable.BaseCellInlineEditor,
         name:           'inlineAC',
         hideMouseLeave: false,

         // Define listener to this editor View's events
         after: {

            //---------
            //  After this View is instantiated and created,
            //     configure the Y.Plugin.AutoComplete as a plugin to the editor INPUT node
            //---------
            editorCreated : function(o){
               var inputNode = o.inputNode,
                   // Get the users's editorConfig "autocompleteConfig" settings
                   acConfig = this.get('autocompleteConfig') || {},
                   editor = this;

               if(inputNode && Y.Plugin.AutoComplete) {
                   // merge user settings with these required settings ...
                   acConfig = Y.merge(acConfig,{
                       alwaysShowList: true,
                       render: true
                   });
                   // plug in the autocomplete and we're done ...
                   inputNode.plug(Y.Plugin.AutoComplete, acConfig);

                   // add this View class as a static prop on the ac plugin
                   inputNode.ac.editor = editor;
               }

            }
         }
     };

PLEASE NOTE: All other attributes from the BaseViewClass apply and can be included within the editorConfig object.

Item Index

Attributes

Attributes

autocompleteConfig

Object

A user-supplied set of configuration parameters to be passed into this View's Y.Plugin.AutoComplete configuration object.

At a bare minimum, the user MUST provide the "source" of data for the AutoComplete !!

For this control to save anything, the user needs to define an "on:select" listener in the AC's "autocompleteConfig" in order to saveEditor when the select action occurs.

Default: {}