[Resolved] form is able to be submitted even if there is validation errors

[Author]

Posts

[danielJ-10]

I am trying to update an user by using toolset user forms. In the form I created a validation to check the size of an image. When I try to upload an image that is exceeding the condition. I receive the error message that I'm attaching. Everything correct there. The problem comes when the user clicks submit again even with the error (this form is using AJAX, so technically the image is still there ready for upload). The form get submitted without the image and the page continue with the next action after submit. Which in this case is a message.

I was expecting that whenever the image is uploaded and exceeding the conditions, to not let the user update the form. This seems to be a bug because the first time the user submits it, the error appears but after trying again, the form is being uploaded...

[Luo Yang]

Hello,

I suggest you try these:
1) Edit your user form, enable option " Use the WordPress Media Library manager for image, video, audio, or file fields", so user can upload image files before the click form's submit button

2) Use filter hook "cred_form_ajax_upload_validate" filter hook to validate uploaded files, see our document:
https://toolset.com/documentation/programmer-reference/cred-api/#cred_form_ajax_upload_validate

[danielJ-10]

I tried the second option (no success) but the problem itself is not that user can't upload a picture. Actually this are the steps where the error appear:

1. User uploads a picture that exceed the conditions (more than 5MB)
2. The form is still working normally, they complete other fields
3. They finish filling the form and they try to submit
4. The form doesn't get submitted because, as expected, the picture doesn't meet the required conditions. (this is correct)
5. The user try again to submit the form even though the form failed to be submitted
6. The form get uploaded WITHOUT the image. <--- This is what shouldn't happen, the form should not be able to be submitted in any way if there is a still a pending requirement.

Looks like the validation gets bypassed after second try, what should I do?

[Luo Yang]

You can setup the custom image field as a required field, and use the "cred_form_ajax_upload_validate" as I mentioned above to do the file validation:
https://toolset.com/forums/topic/form-is-able-to-be-submitted-even-if-there-is-validation-errors/#post-2101941

[danielJ-10]

I added this:

add_filter('cred_form_ajax_upload_validate', 'cover_image_validation', 10, 2);
function cover_image_validation($field_data, $form_data)
{
    list($fields,$errors)=$field_data;
    if ($form_data['id']==28302){
        if(isset($fields['wpcf-user-cover-image']['file_data']['size'])){
			$v = $fields['wpcf-user-cover-image']['file_data']['size'];
            if($v>5025046){
                    $errors['user-cover-image']='the image size should not be more than 5MB';
                }
        }
    }
    return array($fields,$errors);
}

I verified the field name, I checked the form id and now not even the first validation error is appearing.

I can't enable the native wordpress uploader because it show elements that I don't want to display for users. What I'm missing?

[Luo Yang]

If you don't want to use "WordPress Media Library manager", you can
1) disable option " Use the WordPress Media Library manager for image, video, audio, or file fields"
2) Use another filter hook "cred_form_validate" to do the file validation, see our document:
https://toolset.com/documentation/programmer-reference/cred-api/#cred_form_validate

If you still need assistance for it, please provide a test site with the same problem, also point out:
- The problem page URL and form URL
- Where I can edit your PHP codes
I can setup a demo for you.

[danielJ-10]

Sorry, I cannot provide access to this website in any way. The issue is still happening and if you could provide me any hint I might be able to solve it, since is just happening when the user submit a second time after the error message

[Luo Yang]

I assume you don't want your users to use other users image files, Please try these:
1) Install the latest version Toolset Access plugin, you can download it here:
https://toolset.com/account/downloads/

2) Dashboard-> Toolset-> Access control-> Toolset Forms:
Find and disable option "Use any Media Library file when adding files to front-end Post Forms" for specific user roles.
So user can only see his own images when upload files

3) Edit your post form, enable option "Use the WordPress Media Library manager for image, video, audio, or file fields"

4) Put below codes into your theme file "functions.php"

add_filter('cred_form_ajax_upload_validate', function($error_fields, $form_data)
{
    //field data are field values and errors
    list($fields,$errors)=$error_fields;
    //validate if specific form
	$forms = array(28302);
    if (in_array($form_data['id'], $forms) && isset($fields['wpcf-user-cover-image']['field_data']['size']) )
    {
        //check if featured image exists o
        if ($fields['wpcf-user-cover-image']['field_data']['size'] > 5025046)
        {
            //set error message for featured image
            $errors['wpcf-user-cover-image'] = 'the image size should not be more than 5MB';
        }
    }
    //return result
    return array($fields,$errors);
}, 10, 2);

Please replace 28302 with your post form's ID