I am trying to add a button to a Home page that opens a form (modal if possible) from a List. The question is, can this be done without using SharePoint Designer?

I'm trying to decrease the amount of clicks it takes for a user to get to the form. Instead of the user knowing that they need to click on the list in order to add an item, I want a button on the homepage that explicitly says ("Click here to add an item").

I have inserted a button using embedded code, however, when I attempt to add any detailed code, SharePoint cuts the details and adds a labeled button with no functionality.

<input id="clickMe" type="button" value="Click here to add an item!">&nbsp;

Any help would be greatly appreciated!



If you try to put the code into the Page Content field, it will get stripped out. You'll want to insert a Script Editor web part (Under the Media and Content grouping) and insert your code there.

If you want to use the SharePoint modal dialog, insert this into your Script Editor Web Part:

<script type="text/javascript">
function openInDialog(pageUrl,dlgWidth, dlgHeight, dlgAllowMaximize,dlgShowClose,needCallbackFunction,title) 
    var options = { url: pageUrl, width: dlgWidth, height: dlgHeight, allowMaximize: dlgAllowMaximize,
        showClose: dlgShowClose, title: title};     
    SP.SOD.execute('sp.ui.dialog.js', 'SP.UI.ModalDialog.showModalDialog', options);

And then you can call the modal like this:

<input type="button" value="click here to add an item" onclick="openInDialog(&#39;/sites/test/Lists/TestList/NewForm.aspx?IsDlg=1&#39;,812,450,true,true,false,&#39;New Item&#39;);"">

Obviously you would replace my /sites/test/Lists/TestList/NewForm.aspx with the link to your New Form, and the 812,450 with the dimensions you want for your modal.

| improve this answer | |

What you can do is, instead of button, add an anchor tag with following URL format:

<a href='https://server-name/Lists/listName/NewForm.aspx' target='_blank'>Click here to add an item!</a>
| improve this answer | |
  • This works nicely. I've added this to some of my pages to increase their functionality. Thanks! – Omnomicus Feb 3 '16 at 15:35
  • That's good to hear that this works fine, you may mark this as answer:) – Ovais Khatri Feb 3 '16 at 17:42

Similarly to Ovais's method, you can also wrap a button in an anchor.

<a href='https://server-name/Lists/listName/NewForm.aspx' target='_blank'><button type="button" >Click here to add an item!</button></a>
| improve this answer | |

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.