Project

General

Profile

Actions

Feature #58407

closed

Epic #62041: twbs Bootstrap backend, refactor EXT:t3skin and HTML5 output

Epic #62836: FormEngine PHP/HTML Improvements & Bootstrap

Add suggest to TCAs group /select items

Added by Daniel Siepmann over 10 years ago. Updated about 6 years ago.

Status:
Closed
Priority:
Should have
Category:
FormEngine aka TCEforms
Target version:
-
Start date:
2014-05-02
Due date:
% Done:

100%

Estimated time:
1.00 h
PHP Version:
Tags:
Complexity:
easy
Sprint Focus:

Description

Currently it's not possible to search the static items of a group or select TCA column through a suggest wizard.
One example is the include of static typoscript templates.

Actions #1

Updated by Daniel Siepmann over 10 years ago

I did it for our installation and it's simple.

I hope I'll add the patch for TYPO3 soon, as long here is the code so someone else can do it as well.

You have to add the PHP Part to render the input form for suggest. Add the JS to implement the suggest, and register the wizard in TCA.

    $TCA['sys_template']['columns']['include_static_file']['config']['wizards']['suggest'] = array(
        'type' => 'userFunc',
        'userFunc' => 'EXT:' . $_EXTKEY . '/Classes/Tca/Wizard/SuggestWizard.php:Tx_ExtensionKey_Tca_Wizard_SuggestWizard->renderSuggestSelector',
    );


<?php

    /**
     * Add suggest wizard for select with item configuration.
     *
     * This will use the configured items instead of an Ajax call with select.
     *
     * @author Daniel Siepmann <daniel.siepmann@typo3.com>
     */
    class Tx_ExtensionKey_Tca_Wizard_SuggestWizard {

        /**
         * Render the suggest selector.
         *
         * Called by t3lib_TCEforms as userFunc Wizard.
         *
         * @author Daniel Siepmann <daniel.siepmann@typo3.com>
         *
         * @param  array $params The available configuration.
         * @param  t3lib_TCEforms $tceForm The current tce form containing the field.
         *
         * @return string The needed HTML. The needed JS will be added to t3lib_TCEforms directly.
         */
        public function renderSuggestSelector( array $params, t3lib_TCEforms $tceForm ) {
            $extensionName = str_replace( 'Tx_', '', __CLASS__ );
            $extensionName = t3lib_div::camelCaseToLowerCaseUnderscored(
                substr(
                    str_replace( 'Tx_', '', $extensionName ),
                    0,
                    stripos( $extensionName, '_' )
                )
            );
            $params['fieldName'] = 'data[' . $params['table'] . '][' . $row['uid'] . '][' . $params['field'] . ']';
            $html = t3lib_div::makeInstance( 't3lib_TCEforms_Suggest' )->renderSuggestSelector(
                $params['fieldName'],
                $params['table'],
                $params['field'],
                $params['row'],
                $params
            );
            $config = $params['fieldConfig']['wizards']['suggest'];
            $selectedItems = explode( '|', $params['row'][$params['field']] );
            $jsObj = str_replace( ' ', '', ucwords( str_replace( '-', ' ', t3lib_div::strtolower( 'suggest-' . $table . '-' . $field . '-' . $row['uid'] ) ) ) );

            $tceForm->additionalJS_post[$extensionName] = '
                var ' . $jsObj . ' = new TCEForms.Wfp2Suggest(
                    "'. $params['fieldName'] . '",
                    "'. $params['field'] . '",
                    "'. $params['table'] . '",
                    "'. $params['uid'] . '",
                    1,
                    [' . $this->formatItems( $params['fieldConfig']['items'] ) . ']
                );
                ' . $jsObj . '.defaultValue = "' . t3lib_div::slashJS($GLOBALS['LANG']->sL('LLL:EXT:lang/locallang_core.xml:labels.findRecord')) . '";
            ';

            $html .= '<script src="../' . t3lib_extMgm::extRelPath( $extensionName ) . 'Resources/Public/JavaScript/Backend/SuggestWizard.js' . '" type="text/javascript"></script>';

            return $html;
        }

        /**
         * Format items from TCA for usage inside the JS of the suggest Wizard.
         *
         * @author Daniel Siepmann <daniel.siepmann@typo3.com>
         *
         * @param  array $oldItems The original items as configured in TCA.
         *
         * @return string The items ready for usage in JS.
         */
        public function formatItems( array $oldItems ) {
            $newItems = array();
            foreach ($oldItems as $item) {
                $newItems[] = '["' . $item[0] . '", "' . $item[1] . '"]';
            }
            return implode( ',', $newItems );
        }

    }


/**
 * Add suggest wizard for select with item configuration.
 *
 * This will use the configured items instead of an Ajax call.
 *
 * @param  {object} window    The window object of the browser.
 * @param  {object} document  The document object of the browser.
 * @param  {undefined} undefined Just undefined
 *
 * @author Daniel Siepmann <daniel.siepmann@typo3.com>
 */
(function( window, document, undefined ) {

    if (!window.TCEForms) {
        window.TCEForms = {};
    }

    /**
     * Class for JS handling of suggest fields in TCEforms.
     *
     * @author Daniel Siepmann <daniel.siepmann@typo3.com>
     */
    window.TCEForms.Wfp2Suggest = Class.create({
        objectId: '',
        suggestField: '',
        suggestResultList: '',
        minimumCharacters: 2,
        defaultValue: '',
        field: '',

        /**
         * Wrapper for script.aculo.us' Autocompleter functionality: Assigns a new autocompletion object to
         * the input field of a given Suggest selector.
         *
         * @param  string  objectId  The ID of the object to assign the completer to
         * @param  string  field     The field which is currently edited
         * @param  string  table     The table which is currently edited
         * @param  string  uid       The uid which is currently edited
         * @param  integer minimumCharacters the minimum characaters that is need to trigger the initial search
         * @param  array   items     The available items
         *
         * @author Daniel Siepmann <daniel.siepmann@typo3.com>
         */
        initialize: function(objectId, field, table, uid, minimumCharacters, items) {
            this.field = field;
            this.table = table;
            this.uid = uid;
            this.objectId = objectId;
            this.suggestField = objectId + 'Suggest';
            this.suggestResultList = objectId + 'SuggestChoices';
            this.items = items;

            var itemsForSuggest = [],
                i = 0;
            for (i = this.items.length - 1; i >= 0; i--) {
                itemsForSuggest[i] = this.items[i][0];
            }

            new Autocompleter.Local(
                this.suggestField,
                this.suggestResultList,
                itemsForSuggest,
                {
                    partialChars: minimumCharacters,
                    fullSearch: true,
                    updateElement: this.addElementToList.bind( this )
                }
            );

            $(this.suggestField).observe('focus', this.checkDefaultValue.bind(this));
            $(this.suggestField).observe('keydown', this.checkDefaultValue.bind(this));
        },

        /**
         * check for default value of the input field and set it to empty once somebody wants to type something in
         */
        checkDefaultValue: function() {
            if ($(this.suggestField).value === this.defaultValue) {
                $(this.suggestField).value = '';
            }
        },

        /**
         * Adds an element to the list of items in a group selector.
         *
         * @author Daniel Siepmann <daniel.siepmann@typo3.com>
         * @param  object  item  The item to add to the list (usually an li element)
         * @return void
         */
        addElementToList: function(item) {
            var formEl = 'data[' + this.table + '][' + this.uid + '][' + this.field + ']',
                value = '',
                i = 0;

            for (i = this.items.length - 1; i >= 0; i--) {
                if (this.items[i][0] !== item.innerText) {
                    continue;
                }
                value = this.items[i][1];
            }

            // Add item to selected items.
            setFormValueFromBrowseWin( formEl, value, item.innerText, item.innerText );
            // Trigger T3 Framework.
            TBE_EDITOR.fieldChanged(this.table, this.uid, this.field, formEl);
            // Reset suggest field value.
            $(this.suggestField).value = this.defaultValue;
        }
    });

})( window, document );
Actions #2

Updated by Daniel Siepmann over 10 years ago

  • Subject changed from Add suggest to TCAs group items to Add suggest to TCAs group /select items
Actions #3

Updated by Gerrit Code Review over 10 years ago

  • Status changed from New to Under Review

Patch set 1 for branch master of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/29769

Actions #4

Updated by Felix Kopp almost 10 years ago

  • Parent task set to #62836
Actions #5

Updated by Gerrit Code Review almost 10 years ago

Patch set 2 for branch master of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at http://review.typo3.org/29769

Actions #6

Updated by Georg Ringer almost 10 years ago

  • Status changed from Under Review to Resolved
  • % Done changed from 0 to 100
Actions #7

Updated by Benni Mack about 6 years ago

  • Status changed from Resolved to Closed
Actions

Also available in: Atom PDF