My form have multiple required fields. One of them is file upload field.
When I successfully select a file in the upload field, and click submit, if some other fields have errors, I will be led back to the form with red-highlighted fields with errors. This is fine and this is normal, excepted behaviour, but progress percentage without any explanation also appears in my upload field.
Why this progress percentage is appearing in this specific scenario? Does it have purpose at all on this form with errors? How should I approach it? I can probably just remove it with CSS, but I would rather do it with some GF filter, to make sure that complete feature is removed in all different scenarios, screens etc.
The 100% percentage at the end of the upload field corresponds to the file upload percentage.
As you have mentioned, the most straightforward approach to “remove” that percentage from the view is using CSS.
You can leverage the gform_file_upload_markup filter to intercept the file upload markup in the form and remove the file upload percentage.
You can approach the problem by using PHP’s string manipulation like this:
Check if an element with the gfield_fileupload_percent class exists in the markup.
If such an element does not exist, stop further execution and return the markup ‘as is’.
Otherwise, continue the execution. Identify the start and end of the span element with the class gfield_fileupload_percent.
Remove the referenced span element.
Here is a sample code snippet that runs through this process:
add_filter( 'gform_file_upload_markup', 'remove_gfield_fileupload_percent', 10, 4 );
function remove_gfield_fileupload_percent( $file_upload_markup, $file_info, $form_id, $field_id ) {
// Check for the presence of 'gfield_fileupload_percent' in the markup.
$percent_pos = strpos( $file_upload_markup, 'gfield_fileupload_percent' );
if ( $percent_pos === false ) {
// If 'gfield_fileupload_percent' is not found, return the current markup as is.
return $file_upload_markup;
}
// Find the start of the span containing 'gfield_fileupload_percent'.
$start_pos = strrpos( substr( $file_upload_markup, 0, $percent_pos ), '<span' );
// Find the end of the span.
$end_pos = strpos( $file_upload_markup, '</span>', $percent_pos ) + 7;
// Remove the span containing 'gfield_fileupload_percent'.
$file_upload_markup = substr_replace( $file_upload_markup, '', $start_pos, $end_pos - $start_pos );
return $file_upload_markup;
}
No modification is required to execute the snippet and achieve the expected result.
You should add this snippet to your theme’s functions.php file or your preferred code snippets plugin.
Remember to test the code first on a staging or development copy of your website.