SharePoint ECMA : Get pages library items in ECMA

To get the pages library items,  using the JavaScript/JSOM. For that in the clientContext.load we have to pass "File" parameter and than the site columns(internal names)

getNewsPages = function() {
                 var clientContext = new SP.ClientContext.get_current();
                var oList = clientContext.get_web().get_lists().getByTitle('Pages');
                var camlQuery = new SP.CamlQuery();
                camlQuery.set_viewXml(" 50");
                selectedDoc = oList.getItems(camlQuery);
                clientContext.load(selectedDoc , 'Include(Id, Title,File,PublishedDate1,TeaserText,TeaserImage,FileRef,NewsFilter)');
                clientContext.executeQueryAsync(gettingNewsPagesSuccess , onQueryFailed);

            },
            gettingNewsPagesSuccess = function() {
                var listItemEnumerator = selectedDoc.getEnumerator();
                while (listItemEnumerator.moveNext()) {
                    var oListItem = listItemEnumerator.get_current();
                    tempList.push({
                        "Id": oListItem.get_id(),
                        "Title": oListItem.get_item('Title') ,
                        "PublishedDate": oListItem.get_item('PublishedDate1'),
                        "TeaserText": oListItem.get_item('TeaserText') ,
                        "TeaserImage": oListItem.get_item('TeaserImage'),
                        "Path": oListItem.get_item('FileRef'),
                        "NewsFilter": oListItem.get_item('NewsFilter')
                    });
                }

            },

Office 365 : How to update quick launch node in SharePoint 2013

To update a navigation note in SharePoint quick lanuch, we can do by JSOM. In below example we are updating the red box node.

        collChildNavNode =null,
        getNavigationNode = function(web, listData)
        {
             var clientContext = CORO.megaMenucontext;
            // Get the Quick Launch navigation node collection.
            quickLaunchNodeCollection = web.get_navigation().get_quickLaunch();
            clientContext.load(quickLaunchNodeCollection);
            clientContext.executeQueryAsync(getNavigationNodeSuccess,onQueryFailed);
        },
        getNavigationNodeSuccess = function (sender, args) {
            var url = currentProjectObject .Title.replace(/[^a-z0-9\s]/gi, '').replace(/[_\s]/g, '');
            var clientContext = CORO.megaMenucontext;
            collChildNavNode = quickLaunchNodeCollection.get_item(0);     
            clientContext.load(collChildNavNode);
            clientContext.executeQueryAsync(createNavNode ,onQueryFailed);
        },
        createNavNode = function()
        {
            var url = currentProjectObject .Title.replace(/[^a-z0-9\s]/gi, '').replace(/[_\s]/g, '');
            var clientContext = CORO.megaMenucontext;
            collChildNavNode.set_title('Home');
            collChildNavNode.set_url("/sites/dk/sites/projects/" +url);       
            collChildNavNode.update();    
            clientContext.executeQueryAsync(createNavNodeSuccess, onQueryFailed);
        },
        createNavNodeSuccess = function()
        {
            console.log("Created navigation node");
        },

SharePoint 2013 : How to add Device Channel in site/master page

A Device Channel Panel is a control that you can add to a master page or page layout to control what content is rendered in each channel that you create. A Device Channel Panel is a container that specifies one or more channels; if one or more of those channels are active when the page is rendered, all of the contents of the Device Channel Panel are also rendered. A Device Channel Panel can include almost any type of content, including a link to a CSS file or a .js file. It is an easy way to include specific content for specific channels.

There are two limitations to using a Device Channel Panel:

• Display templates Because display templates are rendered on the client side and Device Channel Panels run on the server side, you cannot use a Device Channel Panel within a display template. Instead, you should use two different Content Search Web Parts within Device Channel Panels on your page layout, or use the JavaScript variable to trigger the behavior you want within the display template itself.

• Web Part zones You cannot insert a Web Part zone inside a Device Channel Panel. If you want to allow authors to add Web Parts to a page, and if you are not concerned about the page weight for mobile devices, you can add a Rich Text Editor page field to a Device Channel Panel, and then instruct authors to add Web Parts there. You can add Web Parts directly to a Device Channel Panel (without a Web Part zone).

How to configure device channels?

1. Go to settings of the site
2. 
3. Open the Device Channel from Look and feel section on the page
4. 
5. Default View of the Device Channel settings page
6. 
7. Add rule for the device
8. 
9. Add rule for example for windows phone 8.1
10. 
11. 
12. And save the configuration
13. Go to site settings and select Master page
14. 
15. Open the settings
16. 

Having applied the configuration, if you navigate to the website now using a Windows Phone you should see the Device Channel automatically applied.

SharePoint 2013 : Create a custom web template from publishing site

Well, to create a custom template in SharePoint 2013 or in Office 365 SharePoint, then it’s a very tricky task to complete. The thing very complex with web template is that, it ok up to publishing feature is not enabled in the Template site. But when the publishing feature is activated the that feature automatically gone from SharePoint web site.

Now, there is trick for that, to add that feature again in Site Settings, juts open that sit in SharePoint designer 2013 and activate/make it true. As this property sets to true the link for “Save as site template” will available.

Now, when we save that site template from(Publishing site) then it will have base template be PUBLISHING. So, now we have to add theme to it and also set our custom master etc. They are all be done in the Onet.xml which is get when we export that WSP in visual Studio export wizard template.

Create SharePoint(2013) Publishing pages using ECMASCRIPT

Well, to create paged from page layouts in the Publishing site in SP2013, I have tried the below code

First get the context for web,

             context = new SP.ClientContext(webUrl);  web = context .get_web();

Then get the publishing web for the site

                               pubweb = SP.Publishing.PublishingWeb.getPublishingWeb(context1, web );

                                context .load(web );

                                context .load(pubweb);                               

                                 context .executeQueryAsync(onquerysucced,onqueryfailed);

In onquerysucced get all the pages in the master page library

            

var pageLibrary = web.get_lists().getByTitle("Master Page Gallery");  

var camlQuery = new SP.CamlQuery;

items = pageLibrary.getItems('');

context .load(items,'Include(Id,Title,File)');

context .executeQueryAsync(onPagelayoutsuccess,onqueryfailed);

 

In onPagelayoutsuccess method

             var listItemEnumerator = items.getEnumerator();

             var listItemInfo = '';

             while (listItemEnumerator .moveNext()) {

            var oListItem = listItemEnumerator.get_current();

                pageItems.push({

                "Id":oListItem.get_id(),

                "Title":oListItem.get_item('Title'),

                "obj" :oListItem //Add Object in the list            

                });

             pageItems.push(oListItem);

             }

             //knockout js work for finding the required page layout item from the list

             var newPage = ko.utils.arrayFirst(pageItems(), function(item) {

                                return item.Title == "CT_PageLayout.aspx";

                                }); 

            

          pageInfo = new SP.Publishing.PublishingPageInformation();

          pageInfo.set_name("CT_PageLayout.aspx");

          pageInfo.set_pageLayoutListItem(newPage.obj);

          newPage = pubweb.addPublishingPage(pageInfo);

          context.load(newPage);

          context.executeQueryAsync(onPageCreationSuccess,onqueryfailed);

         };

LiveJournal Tags: SharePoint 2013,SharePoint,Publsihing,ECMA

         function onPageCreationSuccess(){                                

                                                                listItem = newPage.get_listItem();

                context.load(listItem);

                 context.executeQueryAsync(onPageSuccess,onqueryfailed);

          };

SharePoint : Open the list item directly to edit mode.

To open the list item directly to edit form instead of the display form.

Then we have to edit the view on which the list item is showing. Just open the view in the designer in advanced mode and click on the “Title” column=>SQL server basics.

And see the properties which are associated,

Change the HREF property to below property just change the “$FORM_DISPLAY” to “$FORM_EDIT”

{$FORM_EDIT}&ID={$ID}&ContentTypeID={$thisNode/@ContentTypeId}