Open a List Form in a Modal Dialog Box from Left (Current) Navigation

Question

I have read multiple articles on how to do this, but I am running into problems.

eg. link or link

The problem may lie in how I am trying to implement this.

I have a list with a form that I will be using for feedback purposes. I have created a link on the left-hand navigation called Feedback which appears on multiple pages. I want a user to be able to click on this link and have a modal form pop-up over their current page. When finished, the modal form should disappear and allow them to continue what they were doing. Therefore the user never sees the list where the feedback is housed, only I do as the admin.

This seems slightly different from what others have tried to do: implementing a button (using a CEWP) which, when clicked, opens a modal dialogue. Perhaps I am just too dimwitted to figure this out. Is this possible?

thank you!

Answer 1

You can do so using jQuery as there is no mechanism in the left navigation to allow you to embed that.

So after referencing jQuery in your master page, give your left navigation link a url of / just as an initial value, then give it a unique description, for example give it a Description of: Feedback Dialog, that will give your link a title property of "Feedback Dialog". So in developer tools, your link would look something like:

<a class="static menu-item ms-core-listMenu-item ms-displayInline ms-navedit-linkNode" title="Feedback Dialog" href="/"><span class="additional-background ms-navedit-flyoutArrow"><span class="menu-item-text">Feedback</span></span></a>

Now in your JavaScript code, write this:

$("a[Title='Feedback Dialog']").attr("href","javascript:OpenPopUpPage('UrlForNewForm.aspx')");

That way, you will override the behavior and achieve what you want.

Answer 2

In the end another user was able to help me do this. The solution is easy and works on publishing sites. Currently only tested in SP 2010.

Go to your publishing site and edit the URL so it points to _layouts/quiklnch.aspx Something like http://yourServer/sites/yourPublishingSite/_layouts/quiklnch.aspx

Create a new navigation entry and in the URL paste the code below, after modifying the URL to point to your form. Works beautifully!

Something like this: (all one line)

JavaScript:var options=SP.UI.$create_DialogOptions(); options.url='/sites/yoursite/Lists/yourTasksList/NewForm.aspx?RootFolder=&IsDlg=1'; options.height = 400; void(SP.UI.ModalDialog.showModalDialog(options))

Credit to: Mike Smith (MCT MVP) here.