ECMAScript Client Object Model – Get the values from a multi select lookup column field


This post is another continuation of a series of posts related to ECMA Scripting and SharePoint client object model.

ECMAScript Client Object Model – Update a look up field

ECMAScript Client Object Model – Retrieve data from a list

So this time what I’m trying to achieve is to retrieve the values of a list item column. The column is a look up column that brings the data from another list, and the column is a multi select one. So the tricky part is how to iterate through all the lookup values in the specified list item.

Below is the complete ECMAScript for the list item retrieval and then iterating through every item and getting  the lookup values.

<script type=”text/ecmascript” language=”ecmascript”>
 
    // Site collection url. Whatever the value given here the current site collection that
    // the web part is running is picked automaticaly. Not sure about how it happens.
    // Need to investigate more.
    var siteUrl = ‘/’;
 
    // Creating object to hold the item collection with the Id and Value. To enable
    // intellisence while coding(for the ItemContainer), uncomment the below line and
    // comment the right below one.
 
    //var ItemContainer = { ItemList : [{ Id: “”, Value: “” }]};
    var ItemContainer = { ItemList: [] };
 
    function retrieveMultiSelectListItems() {
        var clientContext = new SP.ClientContext(siteUrl);
        var oList = clientContext.get_web().get_lists().getByTitle(‘My List’);
        var camlQuery = new SP.CamlQuery();
        this.collListItem = oList.getItems(camlQuery);
 
        clientContext.load(collListItem);
        clientContext.executeQueryAsync(Function.createDelegate(this, this.onMultiSelectListDataLoadQuerySucceeded), Function.createDelegate(this, this.onMultiSelectListDataLoadQueryFailed));
    }
 
    // Callback function if item retrieval successful.
    function onMultiSelectListDataLoadQuerySucceeded(sender, args) {
        var listItemInfo = ”;
        var listItemEnumerator = collListItem.getEnumerator();
 
        while (listItemEnumerator.moveNext()) {
            var oListItem = listItemEnumerator.get_current();
 
            var lookupValueColl = new Array();
            // Reffer the column using the internal name.
            lookupValueColl = oListItem.get_item(‘MultiSelectLookupCol’);
 
            for (var i = 0; i < lookupValueColl.length; i++) {
                var lookupObject = lookupValueColl[i];
                // get_lookupId() and get_lookupValue() can be used to get the id and the value of the lookup field.
                alert(lookupObject.get_lookupId() + ” ” + lookupObject.get_lookupValue());
            }
        }
    }
 
    // Callback function if item retrieval failes.
    function onMultiSelectListDataLoadQueryFailed(sender, args) {
        alert(‘Request failed. ‘ + args.get_message() + ‘\n’ + args.get_stackTrace());
    }
 
</script>

That’s it! Happy Coding! Smile

Advertisements

One thought on “ECMAScript Client Object Model – Get the values from a multi select lookup column field

  1. Hi ,

    I have a similar requirement where i need to get the multi select lookup value data and in refresh populate the same . Unfortunately for me item.get_item(‘multiselectcolumn’) returned is always blank so the array is returning null.. Can you please let me where i am going wrong .

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