Drupal: How to Get Form Fields in File Upload Form

Last blog post I shared how to implement rich text in a custom Drupal 9 form, I faced similar upshot with files in OpenLucius: couldn't find native, make clean and consummate working example for multiple files upload. Then I figured it out, here is the example code:

Previously I more often than not relied on contrib modules for multiple file uploads in Drupal forms, like Plupload. First of all, at the moment that module isn't available in Drupal 9.

Furthermore, such contrib modules are peachy: they gave me a kicking-outset. But to get to 100% of requirements was always kinda hard and with upgrades they can be a showstopper, I'd like to stay equally lean and native as possible.

Then the more native, the ameliorate. I was really glad I constitute the native form api element'#type' => 'managed_file' and its choice to upload multiple files'#multiple' => Truthful, which basically provides thisDrupal AJAX form element:

Stop-user functions

When implemented correctly this form element generates an ajax-based form in which end-user can:

• upload files without page refresh;
• accept a preview of which files will be saved;
• even delete them before submitting the form.

The Drupal code

For a fully working version, please check theol_messages module in the Drupal social intranet distro OpenLucius.

So, extracted from OpenLucius, here is the example Drupal code. Also run into code explanation underneath.

Explaining well-nigh of import Drupal lawmaking for multiple files upload in custom form

Load Services via Dependency injection

This is an example on how to inject Services via Dependency Injection in a Drupal Course, OpenLucius uses these Services to facilitate everything. In this gist I added the needed code from those services in helper functions.

Build the multiple files upload Drupal form

1. Set default grade values. For the multiple files upload nosotros need$hdd_file_location, which is pretty self explanatory, no? :)
2. You tin also facilitate theedit manner within same form, I stubbed some lawmaking for that here.
3. Facilitatemessage_id, also needed for edit manner.
4. Define theproper noun field (title) for the bulletin.
5. Implement a rich text editor, more details here.
6. Here is where the multiple-files-upload-magic starts: ascertain a field with'#type' => 'managed_file'
7. Ascertain the required'#upload_location'
8. Essential: define'#multiple' => TRUE
9. Also required to make certain no harmful files tin can be uploaded, non even in temporary file directory. This is facilitated in a helper function in this gist, as said normally done via a Drupal Service.

Facilitate submitted values in submitForm()

1. Getname (title) of the bulletin, with an extraXSS security check. More than on Drupal security
2. Get thebody value of therich text editor, cheque this blog for detailed info.
3. Security check for body value.
4. Here is where themultiple files code starts: put the submitted files data in$files variable.
5. Relieve the files via a helper function, which most of the times lives in a Service: since multiple modules probably want to salve files. And you want information technology to exist testable and overrideable. Want a working case? Checkol_messages module code in OpenLucius distro.

Salve uploaded files permanent and attach them to an entity

1. Drupal will provide an array with file id'south via theformSubmit(), nosotros loop through those here.
2. Set all private files to Permanent with Drupal core officesetPermanent(). (!) If y'all don't practise this, the uploaded files will stay in temporary file directory and will be deleted on ~adjacent cron run!
3. Go the file proper name via Drupal core partgetFilename().
4. At present the file is 'physically' uploaded to the deejay, yous need to do something with it, else information technology but sits at that place similar an orphan. In OpenLucius nosotros implemented a custom entity (ol_file) which we use to facilitate files in all kinds of ways in unlike groups: every bit an attachment, as a chat detail, as a file repository item, as a annotate attachment and more.
5. This bulky code facilitates a nice message for terminate-user. I put some attempt in here so user volition get most accurate feedback as possible afterwards uploading a file.

Lastly, some helper functions

As said, these usually live in Services. But to keep this example compact I put them in this gist.

1. To facilitateedit manner: get current message data.
2. Build file location. In OpenLucius we take some extra subfolders likegrouping id anduser id, to keep file directories a clean as possible.
3. Allowed file extensions, y'all could load this from Drupal core settings. Only this gives more flexibility: y'all tin can modify allowed extensions per file upload field.

Wrap up

OK, that's it for now. I hope this will kick-commencement a multiple files upload implementation in your Drupal project in a native, make clean way. Then it's flexible, scalable and hereafter-proof!

Written by Joris Snoek | Sep 01, 2020

wadeslin1939.blogspot.com

Source: https://www.lucius.digital/en/blog/multiple-files-upload-custom-drupal-form-programmatically-native-clean-example-drupal-code

Share this post