Override the pages for lists items new, edit and display

The goal and the need (or why bother override)

When addressing some business needs by customizing a SharePoint installation, it helps users if the customization feels like out of the box SharePoint.

Users get used to the new item and edit UX that shows all the fields the list or the document library has and the way it is laid out with the order the list/library was created (or ordered). The users must fill required fields and can enter data with limited validation.

The customization may need extra effort in creating UX and validation and special order of the fields but requiring the users to do some extra step to create new item or editing existing in a manner different then what they are used to, is not desired. Also, if they can use the existing interface SharePoint provides, they may enter information bypassing the validation rules that are present in the customized version.

It will feel natural and be safer if the customized versions will show up as the default for new edit and display item actions.

The methods

There few ways to achieve this behavior, I will deal with 2 of them available for developers.

This will be Just Part 1 Using SharePoint Designer. Part 2 that I will write later, will discuss the Visual Studio way.  

The SPD method and resources

I learned this way by watching this free video: http://www.sharepoint-videos.com/sp10-webinar-modifying-sharepoint-list-forms-using-sharepoint-designer-2010-and-infopath-2010/

It also shows how to develop the customization with InfoPath but this is not what I want to write about. (And usually recommend not doing)

Steps

  1.      Open SPD and select the library or list the customization is for
  2.       Create New default forms using your own names (so they can survive a future upgrade and be obvious customization)
    1.       {Your}DispForm.aspx as default for Display
    2.       {Your}EditForm.aspx as default for Edit
    3.       {Your}NewForm.aspx as default for New
  3.       Edit {Your}DispForm.aspx
    1.       If the main place holder shows “WebPartPages:ListFormWebPart”, highlight it and delete it. From the insert tab, choose “Display Item Form” and select the name of your list.  
    2.       When selecting a field in the design surface, the ribbon will have a “Data View Tools” section. It has sub tabs with tools helping the design.
    3.       The view tab has a “Task Panes” dropdown, select “Data Source Details”; it will help moving fields around on the page.
    4.       Save and close when done applying your changes.
  4.      Edit {Your}EditForm.aspx
    1.       If the main place holder shows “WebPartPages:ListFormWebPart”, highlight it and delete it. From the insert tab, choose “Edit Item Form” and select the name of your list.  
    2.       When selecting a field in the design surface, the ribbon will have a “Data View Tools” section. It has sub tabs with tools helping the design.
    3.       The view tab has a “Task Panes” dropdown, select “Data Source Details”; it will help moving fields around on the page.
    4.       Save and close when done applying your changes.
  5.       Edit {Your}NewForm.aspx
    1.       If the main place holder shows “WebPartPages:ListFormWebPart”, highlight it and delete it. From the insert tab, choose “New Item Form” and select the name of your list.  
    2.       When selecting a field in the design surface, the ribbon will have a “Data View Tools” section. It has sub tabs with tools helping the design.
    3.       The view tab has a “Task Panes” dropdown, select “Data Source Details”; it will help moving fields around on the page.
    4.       Save and close when done applying your changes.
  6.       If you have web parts developed for your list or library, you can embed them in the pages. You will have to figure out the connection to and from the web part to make sure you access the right item.
  7.       Some client functionality can be done with JavaScript on the page you edit.

Conclusion

 

  1.       The SharePoint designer tool is not the easiest to figure out. There is not much explanation what each item does. So do a lot of experiments.
  2.       Changing forms style, sometimes causes some functionality (such as save) to be missing. Keep versions to go back to.
  3.       The additional functionality you can add to the forms is limited if you do not add web parts. The next part will show how to do it in visual studio and add all the functionality you can think of.

 

Advertisements

About Ofer Gal

SharePointer
This entry was posted in SharePoint Development and tagged , . Bookmark the permalink.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s