Add a picker for EE Files to Shared View form?

I had to play and test around anything that is related to Files because I agree with you.

The documentation is not only lacking but wrong in some parts when it refers to anything related to the file picker, file upload, files on channels, etc. Not sure why anything related to files has such a poor documentation when the rest of it is very detailed.

I can’t really help on this part yet because I just recently started to experiment the files upload and management by users, but I hope someone with more experience in EE updates the docs, maybe with some examples on usage.

I got a hint from Tom Jaeger at PacketTide via Slack DM, posting the conclusions here in case they are useful to someone else in future search etc.

There is a way (currently undocumented…).

The magic element is a method to be found in an undocumented EE legacy library (file_field) called dragAndDropField… which generates a drag-drop CP EE file picker when used in the shared form system. I thought I had seen some serious oversights in the documentation before, but to find it is missing a complete library is a first for me…

Anyhow, the way to use in shared form view is to add an HTML type form element, calling the mystery dragAndDropField element as the field’s content part. So you end up with a field entry that looks something like this…

// ----------------------------------------
// Set default fallback local image
// ----------------------------------------

array(
    'title' => 'jcogs_jcogs_img_cp_fallback_image_local',
    'group' => 'jcogs_img_cp_fallback_image_local',
    'desc' => 'jcogs_jcogs_img_cp_fallback_image_local_desc',
    'fields' => array(
        'img_cp_fallback_image_local' => array(
            'type' => 'html',
            'value' => $settings['img_cp_fallback_image_local'],
            'required' => false,
            'maxlength' => 255,
            'content' => ee()->file_field->dragAndDropField('img_cp_fallback_image_local', settings['img_cp_fallback_image_local'], 'all', 'image')
        )
    )
),

The key things in this are the ‘value’ line and the ‘content’ line. The ‘value’ line needs to be fed an image in the EE Filedir format (i.e. of the form {filedir_X}image_name.ext where X is the number of the File Upload location in the EE File area. The ‘content’ line contains the call to the mystery function. The first parameter is the name of the image field you are trying to populate through the form, the second is the current value for the field (in EE Filedir format), the third and fourth let you specify a specific File area and optionally limit the image to just images… The parameter definition / docblock of the mystery function is thus:

/**
     * Creates a drag-and-drop, control-panel only file field
     *
     * @param string $field_name The name of the field
     * @param string $data The data stored in the file field
     *   e.g. {filedir_x}filename.ext
     * @param string $allowed_file_dirs The allowed file directory
     *   Either 'all' or ONE directory ID
     * @param string $content_type The content type allowed.
     *   Either 'all' or 'image'
     * @return string Fully rendered file field
     */
    public function dragAndDropField($field_name, $data = '', $allowed_file_dirs = 'all', $content_type = 'all')

Good news it works nicely once you get to know about it.

HTH!