SharePoint 2013 Taxonomy field CSOM and jQuery

Wow what a day was yesterday! Felt like I was in an exam and running against time. Yes it was a lot of pressure to create the user News subscription model displayed in a Div. 

I have a simple list with two single line text columns username and the news channel. This list is populated by a webpart.

UserName	News Channel Subscription
Omer-Sheikh	Internal 1
Omer-Sheikh	Corporate
Amna-Saleem	Internal 1

Using second column from this custom list I had to do a lookup on pages library.

My immediate guess was to use jQuery with REST oData and will help me rapidly develop my script. But what do you know! when I started constructing the link 

(http://SP-Site/News/_api/lists/getbytitle('Pages')/items?$select=Title,News_x002d_Information_x002d_Type,ID,*&$format=json&$filter=(News_x002d_Information_x002d_Type eq '7734759f-5e74-420a-89f4-a32c59b3b301')) 

It gave me the following error

The field 'News_x002d_Information_x002d_Type' of type 'TaxonomyFieldType' cannot be used in the query filter expression.

My next selection was to use CSOM (JavaScript) and CAML query. But I soon realised that since the column I wish to filter on, is Taxonomy column therefore I cannot use text values. Instead I had to do a lookup first in a hidden list called 'TaxonomyHiddenList' at the root site and fetch back the WSSID . 

Then using the WSSID I constructed the CAML query for Pages library. This can be seen below:



 camlQuery.set_viewXml('<View><Query><Where>'+     
                                                     '<In><FieldRef Name=\'News_x002d_Information_x002d_Type\'  LookupId=\'TRUE\'  />'  + 
                                                      ' <Values>' + 
                                                                 <Value Type=\'Lookup\'>102</Value>'+
                                                                 <Value Type=\'Lookup\'>104</Value>'+
                                                      '</Values>'  +  
                                                     '</In></Where>' + 
                                          '</View>');     
var     oList    = hubSiteCtx.get_web().get_lists().getByTitle('Pages');   
collListItem   =  oList.getItems(camlQuery);
hubSiteCtx.load(collListItem);      
hubSiteCtx.executeQueryAsync(  Function.createDelegate(this,
this.onGetNewsPagesSucess)  , Function.createDelegate(this, this.onGetNewsPagesFailed) ); 

in above CAML query I constructed the string


                                                                 <Value Type=\'Lookup\'>102</Value>'+
                                                                 <Value Type=\'Lookup\'>104</Value>'+

after the lookup from custom list and Hidden taxonomy list


Second challenge :


The above query returned the data. All simple fields like title, name etc came back fine but the Taxonomy field was returning value = [object] when I used following statement

oListItem.get_item(‘News_x002d_Information_x002d’)

I tried other methods like

JSON.stringify(oListItem.get_fieldValues());

I could clearly see that above method was returning back lots of values for the taxonomy column but I couldn’t get to the label properties.

There isn’t much out there for this topic however after a bit of goggling I found that there is a new js library available

SP.Taxonomy.js

in SP2013. I just added the script link from 15 hive on my page and got some functions. I was only interested in label property but there are wssID , TermGuid etc also available. To get to the label property I used following:

oListItem.get_item(' News_x002d_Information_x002d ').get_label()

I hope this post will save you a bit of time and in time of pressure you can concentrate on more important things.

Happy SharePointing J would love your comments.

 

 

Alternate way:

 

UPDATED 27/02/2013 {

 

Guys , i found another method to get the label of the taxonomy field WITHOUT using Sp.Taxonomy.Js file.

 

Really easy

 

First wrap the oListItem.get_item(' News_x002d_Information_x002d ') in JSON.stringify() method like this and get an alert.

 

alert(JSON.stringify(oListItem.get_item(' News_x002d_Information_x002d ')))

 

This will display the information stored in the [object]. example:

 

<image>

 

by looking at the above image. You can see that you need to call 'Label' to get the details. Therefore just append that at the end.

 

oListItem.get_item(' News_x002d_Information_x002d ').Label

 

Done!

 

}

Regards,

Omer Zubair

[MCPD,MCTS]

would like to thank the post

http://vrdmn.blogspot.com.au/2012/12/working-with-taxonomy-and-javascript-in.html 

for the help.