General developer forum

filepicker form element ideal for uploading a single file not the complex file manager

Picture of Jamie Pratt
filepicker form element ideal for uploading a single file not the complex file manager
Core developersDocumentation writersPlugin developers


I have some thoughts about some improvements to the new interface for uploading files, there has previously been some discussion of this issue in the tracker here I thought I would post here with some screen shots in order to make my ideas clearer and for some wider discussion.

This discussion is about some standard form elements that are used all over Moodle in Moodle forms created using the 'formslib'.

I think that in many or even in most cases in a form developers will want to allow a user to upload only one file or in some cases they will want to upload several files but possibly not use sub folders.

The file manager interface :

Is over complex and busy for this kind of use.

No Sub folders

We can cut out some sections of the interface that are rather confusing if we only want to upload a few files and use no sub folders.

  • The create folder button is already removed when it is not possible to create a sub folder.
  • We can cut out the 'Path ' bit at the top which if no sub folders are allowed, I think this is confusing. Indeed the meaning of this part of the interface only became clear to me when I first created a sub folder and navigated down into it. Unless you do that you may not realise that part of the interface indicates the current folder that you are viewing.
  • In the pop up menu shown below, we can remove the 'Move..' option if there are no sub folders.

Limit of only one file

A very common case in many forms is that we only need to upload one file.

I think the ideal interface for uploading / selecting from a repository one file is the current 'filepicker' form element interface which looks like this :

Ie. we make the following changes to the filemanager component :

  • change the 'Add..' button label to 'Choose File...'
  • remove the download all button
  • remove the path link
  • remove the create folder button
  • remove the fileactions icon which has a popup menu using a dhtml layer and just have a delete icon in it's place. If we are uploading a single file :
    • we don't need a move action,
    • I can't imagine a case where we would need a rename action
    • The download action is not needed because clicking on the link in the file picker forces a download anyway
    • The delete action could optionally be implemented by a delete icon. It would be the default to have this delete option off as it is not needed in many cases.

Differences between Filepicker Form Element and Filemanager file component

Internally the filepicker and filemanager component work in a very similar way. Both components upload files to a draft files area for the user using the form.


Cannot Use the Filepicker to Upload a File That Will be Saved in A 'File Area' And Not Processed and Thrown Away??

The filemanager element is thought of as different to the filepicker element though by some core developers. The filepicker element was meant as an element just to upload a file to a file area and should only, according to documentation now, be used to upload a file that will be processed and not saved in one of a modules fileareas. Files uploaded through the filepicker should always be processed and thrown away, according to current thinking of some developers.

But the filepicker seems to me to be ideal for managing just one file to be uploaded as part of a form, whether or not that one file is going to be saved away somewhere or whether it will be processed and thrown away.

Indeed all the functions used to save a file uploaded by a form and redisplay the file when redisplaying the form which were written for the file manager element seem already to work perfectly as is for the file picker :

Load existing files into draft area

if (empty($entry->id)) {
$entry = new object();
$entry->id = null;
$draftitemid = file_get_submitted_draft_itemid('attachments');
file_prepare_draft_area($draftitemid, $context->id, 'mod_glossary', 'attachment', $entry->id, array('subdirs' => 0, 'maxbytes' => $maxbytes, 'maxfiles' => 50));
$entry->attachments = $draftitemid;

Store updated set of files

if ($data = $mform->get_data()) {
// ... store or update $entry
file_save_draft_area_files($data->attachments, $context->id, 'mod_glossary', 'attachment', $entry->id, array('subdirs' => 0, 'maxbytes' => $maxbytes, 'maxfiles' => 50));
I think it might be nice to have the option of the addition of a 'delete file' icon in the file picker (in cases were uploading the form with no file attached is acceptable ie. uploading the form with 0 or 1 files) and then it is the ideal form element for picking one file to attach to a form.
See screen shot below of how I think the delete icon might look. I don't believe it would be difficult to add this feature to the existing filepicker. 






Average of ratings: Useful (2)
Picture of Jamie Pratt
Re: filepicker form element ideal for uploading a single file not the complex file manager
Core developersDocumentation writersPlugin developers

I have filed some other bugs related to the file picker.

I have added media previews to the filepicker. My patch adds a small 100x100 thumbnail to the filepicker when an image is uploaded or the Moodle media player when an mp3 or video file is uploaded. I think we could add this to the filemanager too.

See screen shot :



Average of ratings: Useful (1)