Learn More





New Community Website

Ordinarily, you'd be at the right spot, but we've recently launched a brand new community website... For the community, by the community.

Yay... Take Me to the Community!

userFileManager jQuery plugin

  • 4/7/2015
  • 681


userFileManager jQuery plugin

Last updated 7 years ago

This article is for a specific plugin. Please be sure to read the Introduction and Overview to jQuery Plugins which provides an introduction to the plugins.


The user file manager is a jQuery plugin which integrates with users "my folder" files i.e. the area where all valid site users can upload files to by default e.g. profile avatars, journal uploads etc. This plugin is used by the dnnComposeMessage jQuery plugin when attachments are enabled, but it is also available for other core or 3rd party extensions.

To do so it's recommend that you use the Client Resource Management API to ensure only a single copy of the script is included and that it is minimized and compacted (if your install has chosen those options) e.g.

<dnn:DnnJsInclude ID="DnnJsInclude2" runat="server" FilePath="~/Resources/Shared/Components/UserFileManager/UserFileManager.js" Priority="102" />

Whilst it's not mandatory, it is recommended to also include the css file that provides for a common look & feel.

<dnn:DnnCssInclude ID="DnnCssInclude2" runat="server" FilePath="~/Resources/Shared/Components/UserFileManager/UserFileManager.css" />

An example of the available options is below:

 $.fn.userFileManager.defaultOptions = {

openTriggerScope: 'body', // defines parent scope for openTriggerSelector, allows for event delegation
openTriggerSelector: '#photoFromSite', // defined in template, opens dialog
dialogClass: 'dnnFormPopup fileManagerPopup',
width: '700px', // dialog width
minHeight: '400px', // dialog height
getItemsServiceUrl: '/DesktopModules/Journal/API/UserFile.ashx/GetItems',
attachCallback: function (file) {
// available properties .id, .modified, .name, .parentId, .size, .thumb_url, .type
alert( + ' attached.');
templatePath: '/Resources/Shared/Components/UserFileManager/Templates/',
templateName: 'Default',
templateExtension: '.html',
/* localized text values: */
title: 'My Files', // dialog title
cancelText: 'Cancel', // dialog cancel button
attachText: 'Attach', // dialog attach button
nameHeaderText: 'Name',
typeHeaderText: 'Type',
lastModifiedHeaderText: 'Last Modified',
fileSizeText: 'File size: '
Subscribe to DNN Digest

DNN Digest is our monthly email newsletter. It highlights news and content from around the DNN ecosystem, such as new modules and themes, messages from leadership, blog posts and notable tweets. Keep your finger on the pulse of the ecosystem by subscribing.  

What is Liquid Content?
Find Out
What is Liquid Content?
Find Out
What is Liquid Content?
Find Out