sharepoint Working with JavaScript Client Object Model (JSOM) Creating Items or Folders

Example

Creating List Items

SP.SOD.executeOrDelayUntilScriptLoaded(createItem,"sp.js");

function createItem(){
    var clientContext = new SP.ClientContext();
    var list = clientContext.get_web().get_lists().getByTitle("List Title");
    var newItem = list.addItem();
    newItem.set_item("Title","Example Title");
    newItem.update();
    clientContext.load(newItem); // only needed to retrieve info from newly created item
    clientContext.executeQueryAsync(function(){
        var itemId = newItem.get_item("ID");
        alert("Item #"+itemId+" Created Successfully!");
    },function(sender,args){
        alert(args.get_message());
    });
}

The example above demonstrates that a list item is created by performing the following:

1. Call the addItem method of a list object to get an item object
2. Call the set_item method on the resulting list item object to set each field value as desired
3. Call the update method on the list item object to indicate that the changes are to be committed
4. Call the executeQueryAsync method of the client context object to execute the queued instructions

Note that you do not need to pass the new item object to the client context's load method to create the item. That step is only necessary if you wish to retrieve any of the item's field values from the server.

Creating Folders

Creating a folder is similar to adding an item to a list. The difference is that one must first create a ListItemCreationInformation object and set its underlyingObjectType property to SP.FileSystemObjectType.folder, and its leafName property to the desired name of the new folder.

The object is then passed as a parameter in the addItem method on the library to create the folder.

// ...
var itemCreateInfo = new SP.ListItemCreationInformation();
itemCreateInfo.set_underlyingObjectType(SP.FileSystemObjectType.folder);
itemCreateInfo.set_leafName(folderName);
var newItem = list.addItem(itemCreateInfo);
// ...

To commit the change, invoke the executeQueryAsync method of the ClientContext object through which the library was accessed.

The full example below creates a folder with a name based on the current timestamp, then opens that folder in a modal dialog.

SP.SOD.executeOrDelayUntilScriptLoaded(createFolder,"sp.js");

function createFolder(){
    var now = new Date();
    var timeStamp = now.getYear() + "-" + (now.getMonth()+1) + "-" + now.getDate() 
        + "T" + now.getHours()+"_"+now.getMinutes()+" "+now.getSeconds()+"_"+now.getMilliseconds();
    var clientContext = new SP.ClientContext();
    var list = clientContext.get_web().get_lists().getByTitle("Library Title");
    var itemCreateInfo = new SP.ListItemCreationInformation();
    itemCreateInfo.set_underlyingObjectType(SP.FileSystemObjectType.folder);
    itemCreateInfo.set_leafName(timeStamp);
    var newItem = list.addItem(itemCreateInfo);
    newItem.update();
    clientContext.load(newItem);
    var rootFolder = list.get_rootFolder(); // Note: use a list's root folder to determine its server relative URL
    clientContext.load(rootFolder);
    clientContext.executeQueryAsync(function(){
        var itemId = newItem.get_item("ID");
        var name = newItem.get_item("FileLeafRef");
        SP.UI.ModalDialog.showModalDialog(
            { 
                title: "Folder \""+name+"\" (#"+itemId+") Created Successfully!", 
                url: rootFolder.get_serverRelativeUrl() + "/" + name
            }
        ); 
    },function(sender,args){alert(args.get_message());});
}