Custom Fields
Re-Envisioned
Support MB Frontend Submission Thumbnail field in frontend form allows any file type

This topic contains 5 replies, has 2 voices, and was last updated by  Anh Tran 1 week, 4 days ago.

  • Creator
    Topic
  • #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?

Viewing 5 replies - 1 through 5 (of 5 total)
  • Author
    Replies
  • #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).

    #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.

    #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.

    #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.');",
        ];
    } );
    #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).

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

You must be logged in to reply to this topic.