I have a form. It works… but the user must wait for the large file to upload first or they won’t be processed by the form. The upload form will change from the Upload button to the name of the file with a Remove button.

    $validators = [       'file_validate_extensions' => ['zip'],     ];      $form['static_archive'] = [       '#type' => 'managed_file',       '#name' => 'static_archive',       '#title' => t('Static archive'),       '#size' => 200,       '#description' => t('ZIP format only'),       '#upload_validators' => $validators,       '#upload_location' => 'private://imports/uploads/',     ];      ...     other fields here     ...      $form['actions']['#type'] = 'actions';     $form['actions']['submit'] = [       '#type' => 'submit',       '#value' => $this->t('Import Archive'),       '#button_type' => 'primary',     ]; 

This form is outputted on a route like I want, file is processed, etc. The only catch is the user having to wait.

I’m hoping there is some JS method for disabling the Submit button while the file is uploading. Bonus if there’s a way to show upload progress or has a message explaining why it’s disabled. The file upload is not a required field, so when the uses the form and the file doesn’t upload before they hit submit, it’s lost in the wind and the user doesn’t even get an error.

This isn’t webforms, so this doesn’t solve it. https://www.drupal.org/project/webform/issues/3010084

This isn’t solve via this patch: https://www.drupal.org/project/drupal/issues/2869855

I also tried clientside_validation: https://www.drupal.org/project/clientside_validation b/c of this: How to prevent an Ajax form from submitting

But I am having no luck solving this. Hoping someone has ideas to share.