Thumbnail field in frontend form allows any file type - Support Fourms

This topic has 5 replies, 2 voices, and was last updated 1 year, 1 month ago by Anh Tran.

Creator

Topic
October 29, 2019 at 2:30 AM #16732

Ryan Lauritsen
Participant

Should the thumbnail field in a frontend form allow any file type to be uploaded?

I think the thumbnail field is a file upload field type, currently. I’m able to upload a PDF as a thumbnail. Seems like it should be an image upload field type so that it only allows uploading of image file types.

If it is intended to be a file upload field type (allow any type of file to be uploaded), then how can I restrict it to certain file types?
Creator

Topic

Viewing 5 replies - 1 through 5 (of 5 total)

Author

Replies
October 29, 2019 at 9:17 AM #16735
Anh Tran
Keymaster
Hi Ryan, thanks for your feedback. The field actually doesn’t filter the file type. There’s a small workaround for that which limits the default file picker:
```
add_filter( 'rwmb_frontend_post_thumbnail', function( $field ) {
    $field['attributes'] = ['accept' => 'image/*'];
} );
```
I’ll see if I can add a code to restrict file types with PHP (which is more secured).
October 31, 2019 at 1:34 AM #16749

Ryan Lauritsen
Participant

Thank you, Anh. This works well. Can I customize the error message shown when attempting to upload a non-image file?

Currently, it says:
Please enter a value with a valid mimetype.

October 31, 2019 at 11:59 AM #16750
Anh Tran
Keymaster
It’s the default browser behavior. I found an answer for that here. Please try this:
```
add_filter( 'rwmb_frontend_post_thumbnail', function( $field ) {
    $field['attributes'] = [
        'accept' => 'image/*',
        'oninvalid' => 'setCustomValidity()',
    ];
} );
```
And write a custom JS function setCustomValidity to handle the invalidity.
November 2, 2019 at 12:09 AM #16773
Ryan Lauritsen
Participant
I tried the following and it didn’t work.
```
add_filter( 'rwmb_frontend_post_thumbnail', function( $field ) {
    $field['attributes'] = [
        'accept' => 'image/*',
        'oninvalid' => "setCustomValidity('Please select an image file.');",
    ];
} );
```
November 4, 2019 at 9:13 AM #16781

Anh Tran
Keymaster

Please don’t put any text inside the setCustomValidity function. The content will be output inside quotes via PHP, so it might break the code. Instead of that, please try to add a custom JS to the page (enqueuing a JS file that contains a setCustomValidity() function).
Author

Replies

Viewing 5 replies - 1 through 5 (of 5 total)

You must be logged in to reply to this topic.