TYPO3 FAL in Flexform add DataProcessing

Question

I got the same problem like this guy -> https://stackoverflow.com/questions/61383959/typo3-fal-in-flexform. So I used this answer but I have some problems to add the data processor. At the moment I render the Element like this:

tt_content.gridelements_pi1.20.10.setup {
1 < lib.gridelements.defaultGridSetup
1 {

prepend = COA
prepend {

  10 = TEXT
  10.value = </div><div class="bg-img-section">


  20 = IMAGE
  20 {
    file {     
      import = uploads/tx_gridelements/
      import.data = field:flexform_image
    }
    dataProcessing {
      10 = TYPO3\CMS\Frontend\DataProcessing\FilesProcessor
      10 { 
        references.fieldName = image as = image 
      }
    }
    stdWrap.wrap = <div class="image">|</div>
  }

  30 = TEXT
  30.value = </div><div class="inner">

}}}

There is no Image shown in FE. I really tried to fix this on my own, but I just couldn't find a solution. I would be very grateful for any help or explanation

Answer 1

The dataProcessing you want to make use of is implemented in the wrong place, since the IMAGE cObject does not have a dataProcessing parameter, but the FLUIDTEMPLATE cObject does.

Additionally the TypoScript code shows that you are not using the dataProcessing static file of Gridelements but the classic plugin based static with the USER cObject.

So you should try to make use of the FILES cObject instead of IMAGE:

tt_content.gridelements_pi1.20.10.setup {
  1 < lib.gridelements.defaultGridSetup
  1 {

    prepend = COA
    prepend {

      10 = TEXT
      10.value = </div><div class="bg-img-section">
    
      20 = FILES
      20 {
           references {
              table = tt_content
              uid.field = uid
              fieldName = myFlexformFieldName
           }
     
           begin = 0
           maxItems = 5
    
           renderObj = IMAGE
           renderObj {
              file.import.dataWrap = {file:current:storage}:{file:current:identifier}
              altText.data = file:current:title
              wrap = <div class="image">|</div>
           }
       }
   
       30 = TEXT
       30.value = </div><div class="inner">

     }
  }
}