Dateiauswahl im eigenen Backendmodul

Hallo,

wie kann ich es bewerkstelligen im Typo3 Backend eine Dateiauswahl im PopUp einzurichten.

Ich habe kein TCA, da es sich hierbei nicht um modul für die Datenbank handelt.

Wenn ich versuche die FormEngine einzubinden gibt mir die DebugConsole ein TypeError: TYPO3.settings.FormEngine is undefined zurück

Ich binde die Formengine im default Layout ein mit

<f:be.pageRenderer
	loadJQuery="true"
	jQueryNamespace="none"
		includeCssFiles="{
			0:'{f:uri.resource(path:\'Lib/bootstrap-colorpicker/css/bootstrap-colorpicker.min.css\')}',
			1:'{f:uri.resource(path:\'Css/Backend/BackendLayout/input.css\')}'
		}"
	includeRequireJsModules="{
			0:'TYPO3/CMS/Backend/FormEngine',
			1:'{f:uri.resource(path: \'Lib/bootstrap-colorpicker/js/bootstrap-colorpicker.min.js\')}',
			2:'{f:uri.resource(path: \'Js/Backend/BackendLayout/input.js\')}'
		}"
/>

Die dateiauswahl wollte ich wie folgt einbinden:

												<f:if condition="{var.header.type} == 'path'">
													<div class="input-group-addon">
														<a href="#" onclick="setFormValueOpenBrowser('file','tx_layout_web_layoutbackendlayout[scss_{var.name}]|||*|'); return false;" class="btn btn-default" title="Dateien durchblättern">
															test
														</a>
													</div>
												</f:if>

Was mache ich falsch?

Ich stehe vor dem gleichen Problem, bin aber einen Schritt weiter.
In meiner Controller Action habe ich folgendes:

$allowed = 'gif,jpg,jpeg,tif,tiff,bmp,pcx,tga,png,pdf,ai,svg';
$foreign_table = 'sys_file_reference';
$objectPrefix = 'data-636-tt_content-NEW58ef3ea48c3ed282512530-image' . '-' . $foreign_table;
$browserParams = 'templatepath|||' . $allowed . '|' . $objectPrefix . '|inline.checkUniqueElement||inline.importElement';
        $onClick = 'setFormValueOpenBrowser(' . GeneralUtility::quoteJSvalue($mode) . ', ' . GeneralUtility::quoteJSvalue($browserParams) . '); return false;';
$button = '<a href="#" class="btn btn-default inlineNewRelationButton b66e2bfc095ad43b352902a3a66be505" onclick="'.$onClick.'" title="Add image">
				<span class="t3js-icon icon icon-size-small icon-state-default icon-actions-insert-record" data-identifier="actions-insert-record">
	<span class="icon-markup">
<img src="/Wrage/typo3/sysext/core/Resources/Public/Icons/T3Icons/actions/actions-insert-record.svg" height="16" width="16">
	</span>
	
</span>
Add image
</a>		
';		
$this->view->assign('button', $button);

$button wird dann in meinem Template aufgerufen. Das sieht dann erst mal so aus

<script type="text/javascript">
/*<![CDATA[*/
top.TYPO3.configuration = {PopupWindow:{height:700, width: 700}};
TYPO3.lang = {};
TYPO3.settings = {}
</script>
<script type="text/javascript">
/*RequireJS-Module-TYPO3/CMS/Backend/FormEngineb14f81e751872aa2cc8d26a5c4f3861e0ca88798*/
require(["TYPO3/CMS/Backend/FormEngine"], function(FormEngine) {
			FormEngine.setBrowserUrl('\/meinVerzeichnis\/typo3\/index.php?route=%2Fwizard%2Frecord%2Fbrowse\u0026token=08570ee1a3390217e6b687013032746862e5689a');
		});
</script>

Wichtig sind noch die TYPO3.settings. Da muss mehr stehen als oben
Das ist erst einmal nicht schön. Zumindest wird das PopUp aber geöffnet. Allerdings weiß ich nicht, wie es jetzt weiter geht. Wenn ich eine Datei auswähle, muss sie ja auch wieder an das Hauptfenster übergeben werden. Vielleicht bist du ja mittlerweile weiter

Ich weiss, das ist alt - aber ich bin bei der Suche auf diesen Thread gestossen. Hatte dasselbe Problem (T3 8.7) und keine Lösung gefunden. Nach stundenlangem Probieren und Analysieren, hab' ich letztlich aber doch eine Lösung erarbeitet:

Im Controller, der das Feld benötigt, im Header folgendes einfügen:

use TYPO3\CMS\Backend\Form\Element\InputLinkElement;
use TYPO3\CMS\Backend\Form\NodeFactory;

In der Funktion, die das Formular generiert, folgenden Code einfügen:

$options = [
        'renderType' => 'inputLink',
        'tableName' => 'myTable',
        'fieldName' => 'url',
        'databaseRow' => [
            'uid' => $myModel->getUid(),
            'pid' => 0
        ],
        'parameterArray' => [
            'fieldConf' => [
                'label' => 'URL',
                'config' => [
                    'eval' => 'trim',
                    'size' => 1024,
                ],
            ],
            'itemFormElValue' => $url,
            'itemFormElName' => 'data[myTable][editform][url]',
            'itemFormElID' => 'data[mytable][editform][url]',
            'field' => 'url',
            'fieldChangeFunc' => [
                'TBE_EDITOR_fieldChanged' => "TBE_EDITOR.fieldChanged('mytable','editform','url','data[mytable][editform][url]');"
                ],


    ];

        $nodeFactory = new NodeFactory();
        $linkField = new InputLinkElement($nodeFactory, $options);
        $urlField = $linkField->render();

        $this->view->assign('renderedUrlField', $urlField['html']);

Das Formular MUSS «editform» heissen, weil gewisse sysext-Javascripts darauf referenzieren.
MyTable ist natürlich die Tabelle, auf die der Controller zugreift.

Im Fluid-Template, das Feld so ausgeben:

<f:format.raw>{renderedUrlField}</f:format.raw>

Format-raw, weil die Funktion aus dem Controller HTML-Code zurückgibt.

Im Default-Template müssen jetzt die Javascripts eingebunden werden, die das Feld benötigt:

    includeJsFiles="{
        1:'/typo3/sysext/backend/Resources/Public/JavaScript/jsfunc.tbe_editor.js',
3:'/typo3/sysext/backend/Resources/Public/JavaScript/jsfunc.inline.js',
        4:'/typo3/sysext/backend/Resources/Public/JavaScript/backend.js'
    }"

    includeRequireJsModules="{
        0:'{f:uri.resource(path:\'JavaScript/ckeditor/ckeditor.js\')}',
        3:'/typo3/sysext/backend/Resources/Public/JavaScript/backend.js',
        4:'TYPO3/CMS/Backend/FormEngine',
        5:'TYPO3/CMS/Backend/FormEngineValidation',
        7:'TYPO3/CMS/Backend/ContextMenu',
        8:'TYPO3/CMS/Backend/FormEngineReview',
        9:'{f:uri.resource(path:\'JavaScript/main.js\')}'
      }"

Zu guter Letzt muss das Javascript-Modul noch aktiviert werden. Das passiert bei mir im main.js (im Javascript-Verzeichnis der Extension:

TYPO3.settings.FormEngine = {"formName":"editform"};

define(['jquery', 'TYPO3/CMS/Backend/FormEngine'], function($){
    'use strict';

    $(function(){
        TYPO3.FormEngine.initialize();
    });
});

TYPO3.settings.FormEngine = {...} ist wichtig, das verhindert die Fehlermeldung, die der OP gepostet hat.

Vielleicht hilft das hier ja jemandem 😉

Sorry, aber die code-tags scheinen bei mir nicht zu funktioneren... 🙁