Removing the upload button in managed files

Question

I want to save a image file into my custom content type using forms api and node_save().

The below code works fine but I also get the upload button as it default in managed_file .

I don't want the upload button. So I tried type=file but it did not work. How can I remove the upload button ?

Also if you just select the file and submit the form it works so I really need to just find a way to remove the upload button.

$form['image'] = array(
    '#type' => 'managed_file',
    '#title' => 'File',
    '#upload_location' => 'public://my-files/'
);

Answer 1

The work to separate out the managed_file element is done in file_managed_file_process(), which is the default #process function for that type of element.

To hide the upload button you need to implement your own simple #process function for the element:

function MYMODULE_my_form($form, &$form_state) {
  $form['image'] = array(
    '#type' => 'managed_file',
    '#title' => 'File',
    '#upload_location' => 'public://my-files/',
    '#process' => array('MYMODULE_my_file_element_process')
  );

  return $form;
}

function MYMODULE_my_file_element_process($element, &$form_state, $form) {
  $element = file_managed_file_process($element, $form_state, $form);
  $element['upload_button']['#access'] = FALSE;
  return $element;
}

Answer 2

@Clive code doesn't work for me

function MYMODULE_my_file_element_process($element, &$form_state, $form) {
  $element = file_managed_file_process($element, $form_state, $form);
  $element['upload_button']['#access'] = FALSE;
  return $element;
}

Invert params in the function's call does the trick

function MYMODULE_my_file_element_process($element, &$form_state, $form) {
  $element = file_managed_file_process($element, $form, &$form_state);
  $element['upload_button']['#access'] = FALSE;
  return $element;
}

Answer 3

You can try the Upload File Replace module:

This is a small utility module that automatically stops Drupal from renaming new files upload via filefield CCK. When 2 files with the same name exist, the older files will be renamed.

Answer 4

Based in this tread I found the way to change the text “['#value']” in the submit button to the file upload in the web form.

Put it in the template.php of your theme and its done.

function MYTHEME_form_webform_client_form_FORMID_alter(&$form, &$form_state) {
  $form['submitted']['photo_file_photo']['#process'] = array('MYTHEME_my_file_element_process');
}

function MYTHEME_my_file_element_process($element, &$form_state, &$form) {
  $element = file_managed_file_process($element, $form_state, $form);
  //$element['upload_button']['#access'] = FALSE;
  $element['upload_button']['#value'] = 'Put me in pls';
  return $element;
}

Answer 5

In Drupal 8 this works for me: (disable ajax for the field)

$form['document'] = [
  '#title' => $this->t('Document'),
  '#type' => 'managed_file',
  '#required' => TRUE,
  '#attached' => [
    'library' => [],
  ],
];

And add this to your_theme.theme file: (hide the upload button).

/**
 * Implements template_preprocess_file_managed_file().
 */
function your_theme_preprocess_file_managed_file(&$variables) {
  switch ($variables['element']['#id']) {
    case 'edit-document':
      $variables['element']['upload_button']['#access'] = FALSE;
      break;
  }
}

Answer 6

Adding a element process hook works but seems like overkill to me. in situations like this where its just an visual thing, CSS is the best way to go IMO since every upload button has its own id anyway.

#edit-image-upload-button{
  display:none;
}