Recently, I was working in an Office 365 application and wanted to open a modal-pop on the click of an anchor tag from a custom publishing page. The requirement was to show a new item form in the modal pop-up. Although, I worked on this kind of requirement back in SharePoint 2010, but not in Office 365.
SharePoint allows us to hide elements from dialogs, however the CSS class to change such elements has changed from SharePoint 2010 to SharePoint 2013 & Office 365.
So, for example, when we create a custom master page, we usually add custom header and footer to System Master Page. This starts appearing the modal-pop which is not required. So the solution for this problem is:-
- In SharePoint 2010, the CSS class name was “s4-notdlg”. This class needs to be added to an HTML element which we want to hide in the modal-pop.
- In SharePoint 2013 or Office 365, we use the same method, just a different CSS class “ms-dialogHidden”.
- You can add the ms-dialogHidden class to any HTML element in your Master Pages and Page Layouts.
- If you have created separate master pages for Site and System (Option available in site Settings Master Page), then you need to specify this class in System Master Page HTML.