0

Sorry for the Newbie question, but I don't see a relevant answer in searching.

I have a SP Online site with a sub-site for Human Resources (HR). I created a custom list for employee feedback for them. It's a very simple list with only 2 fields, EmpName (single line text) and EmpComment (multi-line text). I user PowerApps to create separate forms for Display, Edit and Create. I modified the Create form so it only shows the 2 relevant fields while hiding the other information (such as create date, modify date, etc.) I saved and published the PowerApp forms and it works fine as a (normal) callout process.

For privacy concerns, we don't want the (non-HR) employees accessing the entire list. I have a new page for this test site and I added a Content Editor web part, then edited the Source Code to call a javascript function like so:

<a onclick="javascript:SP.UI.ModalDialog.showModalDialog("http://HR/Lists/Feedback/NewItem.aspx");return false;" href="">Leave New Feedback</a>

I swear this used to work in previous versions, but now SP strips out the relevant markup -- the error is "Warning: Some of your markup was stripped out. Try using the Embed command." So I edited the page again and tried to embed the link, but it still gets stripped. I'm sure there is a simple explanation, but (frankly) my sharepoint is a little rusty.

How can I get this entry form to pop-up as a modal dialog from a link on the page?

Thanks, Glenn

1
  • Can it be so that you use a site collection that is quite new? In that case it probably has NoScript activated. Check the Tenant if you can activate Scripting on the site in question. Commented Apr 24, 2018 at 13:18

1 Answer 1

1

Try placing the modal in a separate function in JS and call that function onclick. Give this a try instead:

EDIT for CEWP use a txt file and reference it in the CEWP. Store your txt file in the Site Assets Library. Give this a try:

<script type="text/javascript" src="https://yoursite/SiteAssets/jquery-1.xx.x.js"></script>

<a href="#" onclick="javascript:showModal()">Leave Feedback</a>

<script type="text/javascript">
    $(function() {
        showModal() {
            var options = {
                url: "http://HR/Lists/Feedback/NewItem.aspx",
                allowMaxSize: true,
                showClose: true
            };
            SP.SOD.execute('sp.ui.dialog.js', 'SP.UI.ModalDialog.showModalDialog', options);
            return true; //you want the PostBack after Save
        }
    });
</script>

This is what I use for Modal Dialogs on my pages.

4
  • Thanks @lazoDev -- where are you placing the code above? I tried putting the SCRIPT in the embed code and the link in the source, but it still strips the onClick out... what am I missing? Commented Apr 23, 2018 at 19:51
  • You can use a CEWP, or JSLINK WebPart to put your code in. Place the web part on your form and reference your custom code in there. Remember to reference the jquery library as well. Commented Apr 23, 2018 at 19:59
  • Hmmm... I think maybe your last point is the problem. Where do I need to reference the jQuery library in this process? In the embed code, correct? Commented Apr 24, 2018 at 12:23
  • Check the edit to my post... Commented Apr 24, 2018 at 12:45

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.