TYPO3: Adding a Javascript Module to the Backend?

Question

I tried to add a custom form element and followed this tutorial here: https://gist.github.com/manuelselbach/dc63abd313694c594d480b163a5f3053

Everything worked except for the JS Module part. Every time I try to load my forms, I just get a 404 error that the Module isn't found and I don't really know why or how to add it to my backend.

My Folder Structure looks like this:

typo3conf
    ext
       tjms
          Configuration
             Form
                 CustomFormSetup.yaml
                 FormEditorSetup.yaml
             Resources
                Public
                   js
                      TjmsTabsViewModel.js

And in my FormEditorSetup.yaml I've added this yaml code:

TYPO3:
  CMS:
    Form:
      prototypes:
        standard:
          formEditor:
            dynamicRequireJsModules:
              additionalViewModelModules:
                1588750194: "/TYPO3/CMS/tjms/TjmsTabsViewModel"

            formEditorPartials:
              FormElement-TjmsTabs: "Stage/SimpleTemplate"

          formElementsDefinition:
            TjmsTabs:
            formEditor:
              label: "formEditor.elements.TjmsTabs.label"
              group: custom
              groupSorting: 1000
              iconIdentifier: "form-multi-checkbox"
      mixins:
        formElementMixins:
          TjmsTabsMixin:
            __inheritances:
              10: "TYPO3.CMS.Form.mixins.formElementMixins.FormElementMixin"

My CustomFormSetup.yaml:

TYPO3:
  CMS:
    Form:
      persistenceManager:
        allowedExtensionPaths:
          100: EXT:tjms/Resources/Private/Forms/
        allowSaveToExtensionPaths: true
        allowDeleteFromExtensionPaths: true
      prototypes:
        standard:
          formElementsDefinition:
            Form:
              renderingOptions:
                templateRootPaths:
                  100: "EXT:tjms/Resources/Private/Forms/Templates/"
                partialRootPaths:
                  100: "EXT:tjms/Resources/Private/Forms/Partials/"
                layoutRootPaths:
                  100: "EXT:tjms/Resources/Private/Forms/Layouts/"
          formEditor:
            formEditorPartials:
              FormElement-TjmsTabs: "Stage/SimpleTemplate"

            TjmsTabs:
              __inheritances:
                10: "TYPO3.CMS.Form.mixins.formElementMixins.TjmsTabsMixin"
      mixins:
        formElementMixins:
          TjmsTabsMixin:
            __inheritances:
              10: "TYPO3.CMS.Form.mixins.formElementMixins.FormElementMixin"

I've included both yaml files in my plugin and my module. But every time I go into my backend > Forms > My Test Form I just receive the errors:

GET http://localhost/TYPO3/CMS/tjms/Backend/FormEditor/TjmsTabsViewModel?bust=d0e6c9adcc1da3f6a39dbdc7b27b9817bcb662c5 net::ERR_ABORTED 404 (Not Found)

VM20251 require.js:1 Uncaught Error: Script error for "/TYPO3/CMS/tjms/Backend/FormEditor/TjmsTabsViewModel"
http://requirejs.org/docs/errors.html#scripterror
    at makeError (require.js:1)
    at HTMLScriptElement.onScriptError (require.js:1)

Anyone got an idea why its not working?

I'm using TYPO3 Version 9.5.18 in a docker setup

Thanks for any help!

Answer 1

This Blog Entry helped me solve the problem:

http://labor.99grad.de/typo3-tx_form-eigenes-formularelement-erstellen-custom-form-element/