Take the 2-minute tour ×
SharePoint Stack Exchange is a question and answer site for SharePoint enthusiasts. It's 100% free, no registration required.

How to create modal popup in Sharepoint I want to put 3 or 4 times java script promth or alerts in the site. How should I made them ?

share|improve this question
1  
Google is your friend –  Daniel Ziga Nov 5 '12 at 9:52
    
I tried a Google methon a lot of times, but it isn't work. –  Grzegorz Z Nov 5 '12 at 9:58
add comment

1 Answer 1

Following is the way to show modal dialog in SharePoint,

Below is the JavaScript with the help of which we can open a Modal Dailog Pop Up of Sharepoint 2010.

 <script type="text/javascript">
    function OpenDialog(URL) {
       var NewPopUp = SP.UI.$create_DialogOptions();
       NewPopUp.url = URL;
       NewPopUp.width = 700;
       NewPopUp.height = 350;
       SP.UI.ModalDialog.showModalDialog(NewPopUp);
   }
 </script>

Call the Javascript on Button click and the modal Pop Up will pops up with the Page of Specified URL. btnOpenPopUp.Attributes.Add("onClick", "javascript:OpenDialog(‘/_layouts/MyAppPage/MyPage.aspx’);");

enter image description here

And if you want to create Alert box or Information box please follow the steps given in the below blog,

http://www.tekritisoftware.com/sharepoint-custom-modal-pop-up-confirmation-dialog-box

Hope this helps,

On Script Part

 // Call openDialog method on button click or on page load 

 function OpenInformationDialog(InformationMessage) {
 var cloneModalContent = document.createElement('div');
 $("#lblInformationMessage").html(InformationMessage);
  cloneModalContent.innerHTML = document.getElementById('InformationBox').innerHTML;

 var options = {
  html: cloneModalContent, // ID of the HTML tag
// or HTML content to be displayed in modal dialog
 width: 375,
 height: 150,
 title: "Error:",
 dialogReturnValueCallback: CloseDialog, // custom callback function
 allowMaximize: false,
 showClose: true
};
SP.UI.ModalDialog.showModalDialog(options);

}

Html:

<div id="InformationBox" style="display:none;">
<div id="Div2" style="height:100px; padding-top:10px;padding-left:10px;padding-right:10px; font-weight:bold;">
 label id="lblInformationMessage"> /label>
</div>
<div id="Div3" style="float:right;padding-right:5px;">
 <input type="button" style="width:75px;" value="OK"     onclick="SP.UI.ModalDialog.commonModalDialogClose(SP.UI.DialogResult.Yes, 'Cancel'); return false;" />
 </div>
  </div>

Change the things according to your logic.

share|improve this answer
    
But if i wont to put a modal dialog box, like alert in java when is something doing in code. Not only on button click. I tried a Hidden Field, but it isn't worked. –  Grzegorz Z Nov 5 '12 at 10:02
1  
I am not getting you correctly, what hidden field will do? you mean are you setting hidden field value , if value==x then show popup, something like that you want to achieve? –  Anuja Nov 5 '12 at 10:06
    
Yes i mean this, because I want to popup, when in callendar value are incorect. Only then. And if values in calendar are corect any allerd or modal shouldn't show. –  Grzegorz Z Nov 5 '12 at 10:10
    
It shoul be see only like woring to person, when dhe values are from outside something –  Grzegorz Z Nov 5 '12 at 10:13
1  
please see the edited answer. –  Anuja Nov 5 '12 at 10:37
show 4 more comments

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.