Determine if SharePoint Page Instance is in Edit Mode from JavaScript

I have been recently working on publishing page layouts and wanted to ensure code required to access EditModePanel controls executes only if page instance is in Edit mode from Javascript. As usual, upon doing quick Google research, I have found several tips including nicely done on stackexchange.

It turns out that every web part pages and SharePoint publishing pages, there is a hidden field “MSOLayout_InDesignMode“, which would allow us to access page mode from client side code.

<input type=”hidden” name=”MSOLayout_InDesignMode” id=”MSOLayout_InDesignMode” value=”” />

Here is the example of how you would determine if your page is in design mode or not from JavaScript

var inDesignMode = document.forms[MSOWebPartPageFormName].MSOLayout_InDesignMode.value;
if (inDesignMode == "1")
// Page instance is in edit mode
// Run code which requires accessing EditModePanel controls
// Page instance is in browse mode

Here is how it looks like in Edit Mode

MSOLayout_InDesignMode in Edit Mode

Here is how it looks like in Browse Mode

MSOLayout_InDesignMode in Browse Mode


This entry was posted in Uncategorized. Bookmark the permalink.

Leave a Reply

Please log in using one of these methods to post your comment: Logo

You are commenting using your account. Log Out /  Change )

Google photo

You are commenting using your Google 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 )

Connecting to %s