Create List item in Folders using Client Object Model

There are scenarios where you would like to add list item to a folder/sub folder in a custom SharePoint list and many of you would like to achieve this using ECMA script/ JavaScript Client Object Model. Before we start with the code, i am assuming that you have enables Folder Content Types in a custom list and have also created a Folder in a list before the below snippet is executed.


function CreateListItemInFolder()
{

// Create client context
 var myContext = new SP.ClientContext.get_current();
 // Get current web (comparable to SPWeb)
 var myWeb = myContext.get_web();
 // Get list by title (comparable to SPList)
   var myList = myWeb.get_lists().getByTitle('Docs');
   // Create new object for list item creation

 //Create List Item Infor and set the Folder Path for the item to be created.      
      var myListItemCreationInfo = new SP.ListItemCreationInformation();
      myListItemCreationInfo.set_folderUrl("http://servername/sites/PP/Blog/Lists/Docs/Folder1");
 var newLinkItem= myList.addItem(myListItemCreationInfo);

     // Set properties for new list item
 newLinkItem.set_item('Title', "Title");
 // Update the new item
 newLinkItem.update();

myContext.executeQueryAsync(Function.createDelegate(this, onSuccessAddQL),Function.createDelegate(this, onFailureAddQL));

}
function onSuccessAddQL(sender, args)
{
alert("Item Added Successfully In the Folder");
SP.UI.ModalDialog.commonModalDialogClose(SP.UI.DialogResult.cancel,'Closing Quick Links Dialog');
}
function onFailureAddQL(sender, args)
{
alert("Item Adding Failed to the Folder");
}

happy coding..

Creating Root Site Collection Using Custom Blog Site Template in Office 365

There are scenarios were you would like to use Blog Template (any default site ) or custom site template as the default site template for the Root Site Collection instead of the regular Team Site In Office 365. By default when you subscribe a new Office 365 Subscription you will have team site as default root site collection.

The steps below will guide you to create the root site collection with a custom blog site template. I have created a site using Blog template and created custom list in the site. After you have the necessity structure for the Blog site in place, save the Site as Site Template and download the Blog Template from the Solution gallery to your local PC.

1. Delete the default root site collection of your subscription, by navigating to the admin portal of Office 365. Your Admin portal looks like the screenshot given below.

2. Now click on the new tab and select New-> Private Site Collection, You will get a new New Site Collection PopUp Screen, specify the title of the site, In the Template Selection, click on the Custom tab and select “Select Template Later”, specify the administrator account and Click OK. The screen should look like below

3. Wait for the site to be created, Once the site is created, Navigate to the site, you will see a Template Selection page were you can select the default template as blog for your root site

4. To use custom blog site template, Click on the Solution Gallery, it will take you to the Solution Gallery, upload the custom Blog Site template WSP and activate. After activating the WSP navigate back to the Template Selection Page and you will be able to see a Custom Tab as shown below, select the BlogSite Template and click Ok

                                    

5. Once the site is created it will navigate you the Set Up Groups for the site Page as shown below and click Ok.

In this way you can use any custom site template or change the default site template for your Office 365 SharePoint Online.

Collapsible Quicklaunch Menu for SharePoint2010 Using Jquery

Recently I have been getting comments on my post Collapsible QuickLaunch SharePoint Menu For MOSS 2007/WSS 3.0 Using Jquery saying this is not working on SharePoint 2010 or is there any solution to get it working in SharePoint 2010. So here is the post that would describe how to achieve this in SharePoint 2010.

The way quick launch is rendered in SharePoint 2010 is different from MOSS 2007/WSS. SharePoint 2010 uses DIV/UL/LI for rendering menu tags compared to TR/TD in the previous versions. The image below shows how the menu is typically rendered in SharePoint 2010.

After doing some research I came to an approach of using Jquery to achieve this. Here is the article which is the base of this approach, so that you can use it to customize further if required. After implementing this how the collapsible quick launch looked.

But there was an issue with post back operation on click of each item on the navigation menu which resulted in losing the menu click item as expanded. To fix this issue I used cookies to maintain the expanded state of a menu item after post back which was posted as comment by Krillehbg on my previous post. The below snapshot show how it looks when you click Lists menu item.

Currently I will be posting the script which you can place it in master page later at some point of time I will make this as feature or someone could work on this to make it as feature.

1. Open the site in SharePoint Designer in which you want to make the QuickLaunch Collapsible.
2. Open the Master Page which resides in the catalog folder.
3. Copy and paste the given snippet above the end of head tag in the master page 

        <script type="text/javascript">
        $(document).ready(function () {


    $("body").addClass("enhanced");
    $(".root li:first").addClass("selected");
    $(".root li").not(":first").find("ul").hide();


    $(".root li.static").click(function () {        
        var menuClicked = createCookie("Menu_Clicked", $('a > span > span ', this).html(), 1);
        if ($(this).parent().find("ul").is(":hidden")) {
            $(".root ul:visible").slideUp("fast");
            $(".root li").removeClass("selected");
            $(this).parent().addClass("selected");
            $(this).find("ul").slideDown("fast");


        }
    });


    var menuClickedOld = readCookie("Menu_Clicked");
        $(".root li.static").each(function () {
        if ($('a > span > span ', this).html() == menuClickedOld) {
            if ($(this).parent().find("ul").is(":hidden")) {
                $(".root ul:visible").slideUp("fast");
                $(".root li").removeClass("selected");
                $(this).parent().addClass("selected");
                $(this).find("ul").slideDown("fast");


            }
            return;
        }
    });
});


function createCookie(name, value, days) { if (days) { var date = new Date(); date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000)); var expires = "; expires=" + date.toGMTString(); } else var expires = ""; document.cookie = name + "=" + value + expires + "; path=/"; } function readCookie(name) { var nameEQ = name + "="; var ca = document.cookie.split(';'); for (var i = 0; i < ca.length; i++) { var c = ca[i]; while (c.charAt(0) == ' ') c = c.substring(1, c.length); if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length, c.length); } return null; } function eraseCookie(name) { createCookie(name, "", -1); } function createCookie(name, value, days) {
    if (days) {
        var date = new Date();
        date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
        var expires = "; expires=" + date.toGMTString();
    }
    else var expires = "";
    document.cookie = name + "=" + value + expires + "; path=/";
}




function readCookie(name) {
    var nameEQ = name + "=";
    var ca = document.cookie.split(';');
    for (var i = 0; i < ca.length; i++) {
        var c = ca[i];
        while (c.charAt(0) == ' ') c = c.substring(1, c.length);
        if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length, c.length);
    }
    return null;
}


function eraseCookie(name) {
    createCookie(name, "", -1);
}
        </script>

Happy Reading :). Please feel free to leave comments

JQUERY RSSReader WebPart for Office365

It’s been long time I have posted any technical posts. This post would describe an alternate for RSS Reader Web part in Office 365. Last week I started to work on one of our client’s requirement to show RSS feed in Office 365. For surprise I came across few posts which indicated RSS Viewer Web Part is not supported.

To start my research first I tried with RSS Reader Web part present in CodePlex written by phil wicklund. If you try to deploy this solution on cloud it would through error because of few limitations that I had posted here in my previous post.

So I started to Google to check how to display RSS feeds in ASP.net which doesn’t use any web part concept. I ended up with This post. With the help of the above two posts I started creating JQUERY RSS Reader web part for office 365.

After completing the development of the base web part, I thought it would be great if can render the rss feeds as ticker instead of static. So I ended up in creating the following display mode 1. Basic and  2.Ticker which can be configured to render feeds accordingly. Here are some snapshots of the configuration and how the web part looks.

Please find below the source code and the WSP for this web part now. Please feel free to modify this webpart according to your needs and let me know if you have any better solution.

Summary of OFFICE 365 Limitations and Workarounds

This blog post will brief you about that various limitations I faced during Office 365 Sandbox development. Sandbox limitations differ when it comes to cloud deployment compared to on premise deployment.You will find various blogs with Sandbox Limitations. 

This post would help you understand these limitations in a quick way, so that you can plan before you start your deployment. If you are a SharePoint Expert this blog would not help you much, but there are lots of Office 365 BeginnersJ.    

1. The WSP package cannot deploy files to hive .i.e. file system. The possible option to uses document library to deploy your files

2. We can use Sandboxed Visual WebParts with some limitations while you are developing for Office 365. You need to install the Visual Studio 2010 SharePoint Power Tools and use Visual WebPart (Sandboxed) Item Template.

  3. Performing asynchronous post back cannot be achieved, we may try using JQUERY, I need to explore more on this and will update my post accordingly.

4. You cannot use Assembly.GetExecutingAssembly on cloud but this will work when you are developing sandbox for on premise application.

5. You cannot use Page.RegisterClient script for registering JavaScript on the page; you can use html render tag to insert script tag in the page. This holds good for adding css. Few say to use embedded resources but not sure if it’s really going to work out on cloud.

6. RSS Reader WebParts doesn’t work on cloud. I have developed an alternate solution to achieve this. Will be posting a post on my blog soon.  

7. You cannot use Run with Elevated privileges in sand box solution.

8. Using resources in sandbox solution is Tricky, which is not feasible while developing solutions for OFFICE 365 or cloud.

Will be updating this blog as and when I find more limitations. Please feel free to comment on the above points or if you have a better workarounds.

Note: Post Updated On August 8 2011