Managed Metadata Column Value Add with Angular | JavaScript & JSOM | CSOM

Following would be high-level program flow;MMS Column Update Program Flow

SP Taxonomy need to be imported.


var scriptbase = _spPageContextInfo.webServerRelativeUrl + "/_layouts/15/";
$.getScript(scriptbase + "SP.Taxonomy.js");

Create custom list item with metadata column in SharePoint with JSOM and Angular JS.

// Adding item to SharePoint custom list with Managed Metadata column (MMS column) with JSOM
(function () {
    'use strict'; 

    // define controller
    var controllerId = "mmsColumnUploadCtrl"; 

    angular
        .module('app')
        .controller(controllerId, ['$scope', mmsColumnUploadCtrl]); 

    // create controller
    function mmsColumnUploadCtrl($scope) {
        //global var
        var vm = this;

        //add metadata column to sharepoint
        vm.AddMetadataColumn = function () {
            var scriptbase = _spPageContextInfo.webServerRelativeUrl + "/_layouts/15/"; 

            // create list item with MMS column
            $.getScript(scriptbase + "SP.Taxonomy.js", createListItemWithMMSColumn); 

        } 

        //Create list item metadata with MMS column
        function createListItemWithMMSColumn() {
            //site URi
            var siteUrl = 'http://<site url>/sites/MMSPOC';
            // List name of updating
            var listName = 'TestList';// List name
            //Term GUID get from Service
            var termId = 'ed414e70-cc02-444b-ba78-8456e6495e45';//term GUID
            //For multi labled column may need to provice term lable also, else no
            //var termLabel = 'ABCTEST';//Term label

            // Client context
            var clientContext = new SP.ClientContext(siteUrl);
            var oList = clientContext.get_web().get_lists().getByTitle(listName);
            var itemCreateInfo = new SP.ListItemCreationInformation();
            var oListItem = oList.addItem(itemCreateInfo);
            // Define item
            oListItem.set_item('Title', 'New Item!'); // non MMS columns
            oListItem.set_item('MMSCol', termId); //MMS column
            // Update item
            oListItem.update(); 

            //client context..Async Req.
            clientContext.load(oListItem);
            clientContext.executeQueryAsync(
                Function.createDelegate(this, onQuerySucceeded),
                Function.createDelegate(this, onQueryFailed)
             );
        } 

        // On query success
        function onQuerySucceeded(oListItem) {
            console.info('Item created!');
        }
        // On query failed
        function onQueryFailed(sender, args) {
            console.error('Request failed. ' + args.get_message() + '\n' + args.get_stackTrace());
        } 

    }; 

})();

Update document library items’ managed metadata column in SharePoint with JSOM and Angular

// Adding item to SharePoint "Document Library" with Managed Metadata column (MMS column) with JSOM
(function () {
    'use strict'; 

    // define controller
    var controllerId = "mmsColumnUploadCtrl"; 

    angular
        .module('app')
        .controller(controllerId, ['$scope', mmsColumnUploadCtrl]); 

    // create controller
    function mmsColumnUploadCtrl($scope) {
        //global var
        var vm = this;

        //add metadata column to sharepoint
        vm.AddMetadataColumn = function () {
            var scriptbase = _spPageContextInfo.webServerRelativeUrl + "/_layouts/15/"; 

            // Create document item ith MSS column
            $.getScript(scriptbase + "SP.Taxonomy.js", updateDocumentItemWithMMSColumn); 

        } 

        // Create document metadata of document library item with MMS column
        function updateDocumentItemWithMMSColumn() {
            //site URi
            var siteUrl = 'http://<site>/sites/MMSPOC'; 

            // List name of updating
            var listName = 'MMSPOCDocLib';//document library name

            // GUID of the term
            var termId = 'ed414e70-cc02-444b-ba78-8456e6495e45';//term guid

            //For multi-valued terms following will be needed
            var termLabel = 'ABCTEST';//term label

            //Item Id for update in the document library
            //3 is item ID to be updated
			//You may dynamically change with the requirement
            var itemIdUpdating = 3; 

            // Client context
            var clientContext = new SP.ClientContext(siteUrl);
            var oList = clientContext.get_web().get_lists().getByTitle(listName);
            var itemCreateInfo = new SP.ListItemCreationInformation(); 

            var oListItem = oList.getItemById(itemIdUpdating);
            // Define item
            oListItem.set_item('Title', 'Item updated!');
            oListItem.set_item('MMSCol', termId);
            // Update item
            oListItem.update(); 

            //client context..Async Req.
            clientContext.load(oListItem);
            clientContext.executeQueryAsync(
                Function.createDelegate(this, onQuerySucceeded),
                Function.createDelegate(this, onQueryFailed)
             );
        }
        // On query success
        function onQuerySucceeded(oListItem) {
            console.info('Item created!');
        }
        // On query failed
        function onQueryFailed(sender, args) {
            console.error('Request failed. ' + args.get_message() + '\n' + args.get_stackTrace());
        } 
    };

Await for more interesting coding samples and articles, keep following!! 

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s