Home > jQuery, SharePoint 2010 > Javascript Detect SharePoint Page In Edit Mode

Javascript Detect SharePoint Page In Edit Mode

In this post I am going to explain different ways to detect SharePoint page mode through client side scripts

If the page is publishing then we can query following  JavaScript variable to find the Page status

if(g_disableCheckoutInEditMode == true) {
   alert('Page is in edit mode');
}
else {
   alert('Page is in display mode');
}

Another options for publishing page

//Add following in master page

<script type="text/javascript">
    var IsEditMode = false;
</script>

<PublishingWebControls:EditModePanel runat="server" id="EditModePanelToFindEditMode">
     <script type="text/javascript">
        IsEditMode = true;
     </script>
</PublishingWebControls:EditModePanel>

//Now through script you can use the variable IsEditMode

We can also query the PageState object which has property ViewModeIsEdit. The problem with this is because the object gets initialized only after loading sp.ribbon.js.

Another option

var IsEditMode = 
document.forms[MSOWebPartPageFormName].MSOLayout_InDesignMode.value; 
if (IsEditMode == "1") { // page is in edit mode } 
else { // page is in browse mode }

For WIKI pages

var IsEditMode = document.forms[MSOWebPartPageFormName]._wikiPageMode.value; 
if (IsEditMode == "Edit") { 
// wiki page is in edit mode 
} else { // wiki page is not in edit mode }
About these ads
Categories: jQuery, SharePoint 2010
  1. Anatoly Mironov
    January 26, 2013 at 12:37 PM

    Reblogged this on Share… What? and commented:
    Really good examples how to detect a sharepoint page in edit mode.

  2. December 18, 2013 at 5:34 AM

    An impressive share! I have just forwarded this onto a co-worker who has been
    conducting a little research on this. And he actually bought me dinner due to the fact that I
    stumbled upon it for him… lol. So let me reword
    this…. Thanks for the meal!! But yeah, thanx for spending time to talk about this topic
    here on your site.

  1. August 21, 2013 at 6:37 AM

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

Follow

Get every new post delivered to your Inbox.

Join 713 other followers

%d bloggers like this: