Get The List Content Types in SharePoint 2010 Using ECMAScript

Introduction

In this article you will see how to get the list content types in SharePoint 2010 using ECMAScript. I have a list named "List Request" which has the following content types (Navigate to the list, click on List tab in the ribbon interface. Click on List Settings button).

1. Item.
2. Folder.
3. Central Content Type.

Steps Involved

1. Navigate to the SharePoint site (I have a site page created in my site where I am going to add the content editor web part).
2. Go to Site Actions, click on the Edit Page.
   
   
    
3. Click on the Insert tab in the ribbon interface and then click on the Web Part button.
   
   
    
4. Select Media and Content in the Categories section and then click on Content Editor.
   
   
    
5. Click on Add.
6. The Content Editor web part will be added to the site page.
7. Click on the down arrow and then click on Edit Web Part.
   
   
    
8. Click on "Click here to add new content".
   
   
    
9. Click on Format Text tab in the ribbon interface and then click on HTML drop down.
   
   
    
10. Click on Edit HTML source.
11. HTML source window will pop up.
    
    
     
12. Copy and paste the following script.
    
       <script language="ecmascript" type="text/ecmascript">
            var contentTypeCollection;
            var listCollection;
            var list;
            function getListContentTypes() {
                var clientContext = new SP.ClientContext.get_current();
                if (clientContext != undefined && clientContext != null) {
                    var web = clientContext.get_web();
                    this.listCollection = web.get_lists();
                    this.list = listCollection.getByTitle("List Request");
                    this.contentTypeCollection = list.get_contentTypes();
                    clientContext.load(this.contentTypeCollection);
                    clientContext.executeQueryAsync(Function.createDelegate(this, this.onQuerySucceeded), Function.createDelegate(this, this.onQueryFailed));
                }
            }

            function onQuerySucceeded() {
                var contentType = 'List Content Types:\n '
                var contentTypeEnumerator = this.contentTypeCollection.getEnumerator();

                while (contentTypeEnumerator.moveNext()) {
                    var content = contentTypeEnumerator.get_current();
                    contentType += content.get_name() + '\n';
                }
                alert(contentType);
            }

            function onQueryFailed(sender, args) {
                alert('Request failed. ' + args.get_message() + '\n' + args.get_stackTrace());
    
     

13. Click on Ok.
14. In the ribbon interface click on Save & Close button.
    
    
     
15. In the content editor web part you can find a button named "Get List Content Types"; click on that button.
    
    
     
16. An alert will pop up displaying the list content types.
    
    
    

Reference

SP.List.contentTypes Property - http://msdn.microsoft.com/en-us/library/ee556719.aspx

Summary

Thus in this article you have seen how to get the list content types in SharePoint 2010 using ECMAScript.