Solution to save multiple tags and hyperlink with description together to SharePoint list

In SharePoint you can save and get the information from list easily using AJAX call, CSOM and JavaScript. While saving multiple tags to the column of type ‘managed metadata’ with hyperlinks and descriptions for each metadata, common problems faced are–

• If tags are saved first, then rest of the items vanish
• If other information is saved first, then ‘tags’ column is left blank
• Many a times URLs with their descriptions get disorganized

Solution to the above problems is provided below to save multiple tags and URL with description successfully. Remember that for saving tags, their GUID value is essential. Here ‘oListItem.update’ is executed for all the items to be saved and at last ‘executequeryasync’ for finally saving it to the SharePoint list after the loop. Steps to follow –

1. Setup context and load web
2. Load taxonomies field
3. Save URL and description
4. Save tags having their GUID value and NAME value
5. Update every time oListItem till the length of the item
6. At last, execute clientContext.executeQueryAsync after all the items are loaded

This will save all the information without leaving any of the details blank. Below is the code for the implementation of the same. ‘ListName’ is the name of the list in which the data is to be saved.

Setup context & load web

var clientContext = new SP.ClientContext.get_current();

var oList = clientContext.get_web().get_lists().getByTitle(ListName);

Load properties of tag field

var field = oList.get_fields().getByInternalNameOrTitle(TagColumnName);

var txField = clientContext.castTo(field, SP.Taxonomy.TaxonomyField);

clientContext.load(txField);

clientContext.executeQueryAsync(function() {

var urlLink = ”, description = ”;

Loop to save multiple hyperlinks with description

for (var j = 0; j < resourceURL.length; j++) {

urlLink = resourceURL[j][0];

description = resourceURL[j][1];

var itemCreateInfo = new SP.ListItemCreationInformation();

var oListItem = oList.addItem(itemCreateInfo);

var urlValue = new SP.FieldUrlValue();

urlValue.set_url(urlLink);

urlValue.set_description(description);

This code is to save multiple tags to metadata column. For saving tags, their GUID and NAME value is essential.

if (txField.get_allowMultipleValues()) {

var terms = new Array(),termValueString ,guid = [],name = [];

guid = selectedguid.split(“,”);

name = selectedValue.split(“,”);

for (var i = 0; i < guid.length; i++) {

terms.push(“-1;#” + name[i] + “|” + guid[i]);

termValueString = terms.join(“;#”);

}

var termValues = new SP.Taxonomy.TaxonomyFieldValueCollection(clientContext, termValueString, txField);

txField.setFieldValueByValueCollection(oListItem, termValues);

}             

oListItem.set_item(‘Link’, urlValue);

Update Listitem

oListItem.update();

clientContext.load(oListItem);

}

clientContext.executeQueryAsync(function(){ alert(“Success”);}, OnFailure);

},

onFailure

);

Points to remember while saving multiple taxonomies with multiple URLs and description:

• First load properties of tag field and upon success, save tags having their GUID value
• Execute client context only after all the items are updated in the loop