I would like to open up a user form in a pop-up window by clicking on an image in the page.

I have tried adding code to the source editor, but it just gets stripped.

There is much talk of SP.UI.ModalDialog being the solution. However, I am very new to Sharepoint and would not know where or how to apply this.

Could anyone share an example of where a pop-up form is opened on the click of an image?

Many thanks


Try the below code in Script Editor Web Part

function openDialog(pageUrl) {
var options = {
url: pageUrl,
title: 'Title of the Dialog',
allowMaximize: false,
showClose: true,
width: 500,
height: 500
SP.SOD.execute('sp.ui.dialog.js', 'SP.UI.ModalDialog.showModalDialog', options);

<a href="#" onclick="openDialog('http://url');"><img src="mqassas.gif"></a>

  • At <img src="mqassas.gif">, set the image URL ,and to be clickable it would be added within <a> tag
  • At onclick="openDialog('http://url');", set the URl that you need to shown in Modal Dialog

Check the detail steps at open a SharePoint link via SharePoint Modal

|improve this answer|||||
  • Wow that's nearly perfect! I just need to try and work out the url of the image and it will be exactly what I am after. Thanks!! – David Bentley Sep 26 '17 at 13:58
  • Take your time, Hope it helps you! – Mohamed El-Qassas MVP Sep 26 '17 at 14:00
  • Got it! Used good old F12. I will mark as correct answer. – David Bentley Sep 26 '17 at 14:07
  • Is there an additional function to close the modal when you click anywhere outside the window? – Sarah Grzymkowski Dec 5 '18 at 20:52

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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