createFolder( )

Creates a new folder in the Media Manager.

Description

The createFolder() function returns a Promise that resolves to the created folder.

Use the parentFolderId parameter to specify in which existing folder you want the new folder to be created. If no folder is specified, the new folder is created in the media-root folder.

Admin Method

This function requires elevated permissions to run. This function is not universal and runs only on the backend.

Syntax

function createFolder(displayName: string, options: CreateFolderOptions): Promise<CreateFolderResponse>

createFolder Parameters

NAME

TYPE

DESCRIPTION

displayName

string

Folder name that appears in the Media Manager.

options

Optional

CreateFolderOptions

Options for specifying where to create a folder.

Returns

Return Type:

Promise<

CreateFolderResponse

NAME

TYPE

DESCRIPTION

folder

Folder

Information about the newly created folder.

Was this helpful?

Create a folder (dashboard page code)

Copy Code

1import { folders } from 'wix-media.v2';
2
3/* Sample displayName value: 'Vector Art'
4 * 
5 * Sample options value:
6 * {
7 *    parentFolderId: 'b2bc72834460412494c93617d88b8c89'
8 * }
9 */
10
11async function myCreateFolderFunction(displayName, options) {
12  try {
13    const newFolder = await folders.createFolder(displayName, options);
14
15    console.log('Created folder successfully:', newFolder);
16    return newFolder;
17  } catch (err){
18    console.error(err);
19    // Handle the error
20  }
21}
22
23/* Promise resolves to:
24 * {
25 *   "folder": {
26 *     "_createdDate": "2023-08-14T08:05:03.000Z",
27 *     "_id": "128833f888ea4846bbfbe8f164f3c6b5",
28 *     "_updatedDate": "2023-08-14T08:05:03.000Z",
29 *     "displayName": "Vector Art",
30 *     "parentFolderId": "b2bc72834460412494c93617d88b8c89",
31 *     "state": "OK"
32 *   }
33 * }
34 */

Create a folder (export from backend code)

Copy Code

1import { Permissions, webMethod } from 'wix-web-module';
2import { folders } from 'wix-media.v2';
3import { elevate } from 'wix-auth';
4
5
6/* Sample displayName value: 'Vector Art'
7 * 
8 * Sample options value:
9 * {
10 *    parentFolderId: 'b2bc72834460412494c93617d88b8c89'
11 * }
12 */
13
14export const myCreateFolderFunction = webMethod(Permissions.Anyone, async (displayName, options) => {
15  try {
16    const elevateCreateFolder = elevate(folders.createFolder);
17    const newFolder = await elevateCreateFolder(displayName, options);
18
19    console.log('Created folder successfully:', newFolder);
20    return newFolder;
21  } catch (err){
22    console.error(err);
23    // Handle the error
24  }
25});
26
27/* Promise resolves to:
28 * {
29 *   "folder": {
30 *     "_createdDate": "2023-08-14T08:05:03.000Z",
31 *     "_id": "128833f888ea4846bbfbe8f164f3c6b5",
32 *     "_updatedDate": "2023-08-14T08:05:03.000Z",
33 *     "displayName": "Vector Art",
34 *     "parentFolderId": "b2bc72834460412494c93617d88b8c89",
35 *     "state": "OK"
36 *   }
37 * }
38 */

Create a folder from visitor input

This code is an example of a page on which a visitor chooses a folder from a dropdown list, and then creates a folder within that folder.

Copy Code

1/***************************************
2 * Backend code - create-folder.web.js *
3 **************************************/
4
5import { Permissions, webMethod } from 'wix-web-module';
6import { folders } from 'wix-media.v2';
7import { elevate } from 'wix-auth';
8
9export const listFolders = webMethod(Permissions.Anyone, async () => {
10  try {
11    const elevatedListFolders = elevate(folders.listFolders)
12    const foldersList = await elevatedListFolders();
13
14    return foldersList;
15  } catch (error) {
16    console.error(error);
17  }
18});
19
20export const createFolder = webMethod(Permissions.Anyone, async (displayName, options) => {
21  try {
22    const elevateCreateFolder = elevate(folders.createFolder);
23    const newFolder = await elevateCreateFolder(displayName, options);
24
25    return newFolder;
26  } catch (err){
27    console.error(err);
28  }
29});
30
31/*************
32 * Page code *
33 ************/
34
35import { createFolder, listFolders } from 'backend/create-folder.web';
36
37$w.onReady(async () => {
38  await populateFoldersDropdown();
39
40  $w('#createFolder').onClick(async () => {
41    const folderName = $w('folderName').value;
42    const createOptions = {parentFolderId: $w('foldersDropdown').value};
43    const newFolder = await createFolder(folderName, createOptions);
44
45    console.log(`Successfully created new folder "${folderName}" in ${$w('#foldersDropdown').label}.`)
46    $w('#createdFolderSuccessMsg').show();
47  });
48});
49
50async function populateFoldersDropdown() {
51  const folders = await listFolders();
52  const dropdownOptions = folders.map((folder) => {
53    return {
54      label: folder.displayName,
55      value: folder._id
56    };
57  });
58
59  $w('#foldersDropdown').options = dropdownOptions;
60};