Skip to content
This repository has been archived by the owner on May 21, 2021. It is now read-only.

Missing feature: Remove uploaded image #15

Open
marble opened this issue Apr 2, 2015 · 10 comments
Open

Missing feature: Remove uploaded image #15

marble opened this issue Apr 2, 2015 · 10 comments

Comments

@marble
Copy link
Contributor

marble commented Apr 2, 2015

Description:
Lets say our domain object has a $logo and a $firstName. When editing the record you can set and then empty $firstName back and forth. But with the current version of upload_example you CANNOT remove a $logo once it's uploaded. That should be possible as well.

What I've tried
... works only partly. That is, it works as long as objects are not persisted. I've added a checkbox for removing

724

In Fluid:

<f:form.checkbox name="offer[logo][submittedFile][remove]" value="remove"
                      id="logoSubmittedFileRemoveField"/>

And a clause in the UploadedFileReferenceConverter.php:

public function convertFrom($source, $targetType, array $convertedChildProperties = array(), PropertyMappingConfigurationInterface $configuration = NULL) {
    if (!isset($source['error']) || $source['error'] === \UPLOAD_ERR_NO_FILE) {
        if (isset($source['submittedFile']['remove']) && strlen($source['submittedFile']['remove'])) {
            // No new file is uploaded and the 'remove' checkbox is checked.
            // Forget a possibly attached resource
            return NULL;
        }
        if (isset($source['submittedFile']['resourcePointer'])) {
   ...

Good:
This works for non persisted files.

Bad:
It's not enough to just remove a file (reference!) in that way if it's persisted before. So you get for example:

725

Missing:
Code to delete the (FAL) file reference.

Sorry...
I'm trying to dive into extbase and fal and so ... but I'm not ready to come up with a solution yet.

@fsaris
Copy link

fsaris commented Apr 10, 2015

I did it by just remove the "hidden" element that holds current relation and save the form.

<h:form.upload property="image" class="upload-field" >
   <f:if condition="{resource}">
     <span class="preview">
       <f:image image="{resource}" alt="" width="50"/>
       <span href="#" onclick="$(this).parents('.upload-field:first').find('input[type=hidden]').remove(); $(this).parent().remove(); return false;" class="remove icon-remove">&#x2716;</span>
     </span>
   </f:if>
</h:form.upload>

Could be that above snippet doesn't work as I didn't cut/paste it from the project because there was a lot of more markup etc. But I think you should get the idea.

gr. Frans

@joekolade
Copy link

Hej Frans,
I try to implement your solution, but removing the corresponding fields

<input type="hidden" name="[EXTKEX][kompetenzprofile][europass][submittedFile][resourcePointer]" value="17915a47da85ed0b7e13df1f4a0cd303e98971dc2b93">

and

<input type="file" name="[EXTKEX][kompetenzprofile][europass]">

and saving the form afterwards (as when uploading files) wont delete my filereference at all....
Did you something in addition to get that to work?

@marble
Copy link
Contributor Author

marble commented Nov 26, 2015

I talked with sritter at the T3DD15 about this stuff. Once the upload is persisted the file reference exists in the table. Next time you persist something, you'll have to remove superflous references on your own from the table. Use the normal TYPO3 database API.

@Shupal
Copy link

Shupal commented Dec 15, 2015

Cause the lack of a implemented delete function?;-)

so is the right way to remove references and update refindex via database API?

@marble
Copy link
Contributor Author

marble commented Jan 13, 2016

Crosslink: See this great new post by maddy as well: http://ab-softlab.tumblr.com/post/119838114044/fileupload-in-frontend-using-typo3-6x-or-7-fal

@thomaskieslich
Copy link

Hi Martin,
this example is for a subobject, but it works:
Partial:

<f:for each="{room.bilder}" as="bild" iteration="bildNum">
            <div class="medium-3 columns">
              <f:image image="{bild}" width="240m" height="160m"/>
              <f:form.checkbox property="rooms.{it.index}.removeBild.{bildNum.index}" value="{bild.uid}" />löschen
            </div>
          </f:for>

in the room Model i add

/**
     * @var array
     */
    protected $removeBild = array();
plus Getter/Setter.
in Controller updateAction:
if(array_filter($room->getRemoveBild())){
                    $bilder = $room->getBilder();
                    foreach($bilder as $bild){
                        $imageId = $bild->getUid();
                        if(in_array($imageId, $room->getRemoveBild())){
                            $room->removeBild($bild);
                        }

                    }
                }

The Model must have a Part like:

public function removeBild(\TYPO3\CMS\Extbase\Domain\Model\FileReference $bild)
    {
        $this->bilder->detach($bild);
   }

Works fine, Greetings from Kiesi

@thomaskieslich
Copy link

    /**
     * bilder
     *
     * @var \TYPO3\CMS\Extbase\Persistence\ObjectStorage<\TYPO3\CMS\Extbase\Domain\Model\FileReference>
     */
    protected $bilder = null;

    /**
     * @var array
     */
    protected $removeBild = array();


    /**
     * @var \TYPO3\CMS\Extbase\Domain\Model\FileReference
     */
    protected $bild = null;

But have a look at the UploadedFileReferenceConverter. It must use the same FileReference Model. The original use a HelHum one.
Regards Thomas

christian2222 added a commit to christian2222/typo3 that referenced this issue Feb 13, 2017
@brisellda
Copy link

brisellda commented Oct 13, 2017

This linked helped me implement a remove-Function:
http://blog.typo3servers.info/show/typo3-extbase-fal-removedelete-image/

@marble
Copy link
Contributor Author

marble commented Oct 18, 2017

@brisellda Hey, thank you, cool. To make it complete: Ghanshyam Gohel then points to http://blog.typo3servers.info/show/typo3-extbase-fal-image-upload as well. Looks good.

@ghanshyamgohel
Copy link

@brisellda @marble This is Ghanshyam Gohel.

Thanks for the point those links but unfortunately, expired those links.

Then, I have created complete example for FAL image upload and image delete here:

https://gist.github.com/ghanshyamgohel/43993b657797876fcee23752af87f31e

Note: I highly recommend to use upload_example extension by Mr. Helmut Hummel

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

8 participants
@marble @joekolade @Shupal @fsaris @thomaskieslich @ghanshyamgohel @brisellda and others