1. Fabrik 3.9 has been released. If you have updated Joomla to 3.9, this is a required update.
    Dismiss Notice

Fileupload element loses file after failed validation

Discussion in 'Community' started by p38, Dec 8, 2018 at 10:10 AM.

  1. p38

    p38 Member

    Level: Community
    Hi All, using the file upload element in non-ajax way, I find that if a form fails any element validation, then all the files previously marked for upload are lost.

    Now I have a form with 8 file uploads, and my customers are getting pretty peeved off because they forgot to fill in an invoice no, and have to re upload all 8 files again after the validation fails.

    Anyone got any ideas how to get around this?

    Paul
     
  2. troester

    troester Well-Known Member Staff Member

    Level: Community
    As far as I know this is a HTML thing with non-ajax fileuploads (there should be a thread somewhere).
    Can you switch to ajax fileupload? You can set max to 1 if you need multiple single uploads.
     
  3. p38

    p38 Member

    Level: Community
    thanks troester, I will try that, altho once changed, all the 100's of files images already uploaded will not show in the list, as it changes the way the files are stored.

    However, if this solves the problem, then perhaps I can backdate all the old files
     
  4. troester

    troester Well-Known Member Staff Member

    Level: Community
    I think with filemax=1 ajax-fileupload is handled without repeat table (like the non-ajax one).
    But I didn't test, so yes, be careful and maybe post results here (and/or add to WIKI).

    There's a remark in the WIKI "NOTE! Until a good solution is found the fileupload element in ajax mode doesn't work within any joined group, repeated or not."
    I don't know if this is still valid.
    And there have been issue with ajax or non-ajax in popup forms (I never can remember which one and I don't know if this was fixed...).
    So just try...
     
  5. troester

    troester Well-Known Member Staff Member

    Level: Community
    Seems with filemax=1 it's not using a repeat table but storing a JSON
    [{"file":"\\images\\stories\\Lighthouse.jpg","params":"{\"rotation\":0,\"scale\":261,\"imagedim\":{\"x\":200,\"y\":200,\"w\":469.79999999999995,\"h\":352.34999999999997},\"cropdim\":{\"x\":310,\"y\":206,\"w\":180,\"h\":150},\"crop\":true,\"quality\":0.9,\"mainimagedim\":{\"x\":200,\"y\":200,\"w\":180,\"h\":135}}"}]

    instead of non-ajax
    /images/stories/Lighthouse.jpg
    So I think you can switch but have do run some phpmyAdmin to create this format with some default values.
     
  6. p38

    p38 Member

    Level: Community
    Hi Troester, I have done some tests using AJAX uploads.Here are my findings.....

    1) If a validation fails, the filename is retained, so this solves the validation problem
    2) The AJAX file upload does NOT work in an AJAXIFied form, which is not an issue for me as I never use them, they are too temperamental.
    3) After upload, an unwanted preview modal pops up, and there is no setting to disable this. No trainsmash, altho on mobile it was set to 440px so it went off screen. It took me a while working through the source code to figure out that it uses the crop width and crop height setting, even though I had switched the crop off. This tells me that after upload, a check is not done to see if crop is switched off before previewing the cropped image
    4) Once uploaded on the form, in the mobile app, sometimes the image is not shown if I press the preview button, altho the preview fabrik modal window does popup. It looks like a refresh issue,
    5) When the preview works, I notice it does not scale the image to the modal window size, so if you have a large image, it is rather useless
    6) Finally, here is a major issue I discovered which is kinda a deal breaker...... If I start uploading an image and save the form BEFORE it had uploaded fully, then the images is lost. So it looks like there is no check to see if an AJAX call in in progress before saving the form.

    Perhaps one can play around with an element validation to prevent this, but the thing is the upload elements on my form are optional uploads, so I cant even put an isempty validation. To get around this I need to set a flag as soon as the AJAX starts, and then I can do a validation isempty condition to determine if the file name exists in the element or on the server

    Have you perhaps any ideas?

    Paul

    PS: I can backdate all my old single filenames using teh format, so no problem here
     
    Last edited: Dec 8, 2018 at 3:48 PM
  7. cheesegrits

    cheesegrits Support Gopher Staff Member

    Level: Community
    Yup, the issue with non-AJAX uploads being removed after a failed validation is an HTML thing. It's a security issue, to prevent malicious forms pre-filling a file input field with (say) '/etc/passwd', or any other sensitive local file, hiding that input on the form, and silently hardvesting your private files. There is no way of working round it, other than using AJAX uploading.

    2 - that's a browser thing. It is possible with some modern browsers to upload when the form is submitted with AJAX, but unfortunately it doesn't work on some fairly major browsers (like IE and Safari). I did add some code earlier this year in the form JS submission method that does it, but I've disabled it for the moment, till I figure out a reliable way of knowing if the browser supports it, as otherwise uploaded files just get lost with no trace and no feedback.

    3 - yeah, preventing that automatic preview opening is fairly high on my priority list to fix. I'll try and get it done this weekend.

    4 - haven't experienced that but then, I don't do much testing on mobile for uploads, as it's not something our clients have needed as of yet. As with most Fabrik features, we put most of our effort into stuff we need, when developing for the clients who pay our bills.

    5 - I'll take a look at that when I work on 3

    6 - we definitely do have extensive code that should prevent the form being submitted until all uploads are complete. Our form JS has a "submit broker" ...

    https://github.com/Fabrik/fabrik/blob/master/media/com_fabrik/js/form.js#L1370

    ... called during submit. The submit broker then calls 'onsubmit' for all elements, and in the fileupload JS, that checks to see if all files are uploaded:

    https://github.com/Fabrik/fabrik/blob/master/plugins/fabrik_element/fileupload/fileupload.js#L763

    ... and if not, the submit broker will keep trying every 500ms ...

    https://github.com/Fabrik/fabrik/blob/master/media/com_fabrik/js/form-submit.js#L58

    If that isn't working, it usually means some other error is short circuiting the submission process.

    However, it is of course possible that there's a problem with the way the upload element confirms that files are uploaded, so I'll test that. But take a look at the console in your browser's dev tools, see if there are any JS errors being reported during form load or submission.

    -- hugh
     

Share This Page