A new feature in SharePoint 2010 is that you can customize the form that is displayed when you create a new list item by using InfoPath. That means that you can leverage the extensive capabilities of InfoPath without having to write a single line of code – and that’s a good thing, if you’re as lazy as I am and want to avoid resorting to custom code.
To do it, you simply go to the list you want to customize, click on Customize Form, and edit the InfoPath form that was thoughtfully created for you. Once you’ve published the form, you’ve got a custom form for your list. SharePoint will automatically create a read-only version of your form for displaying items. Easy!
But what if you want to have a different form when creating new items, one for editing items, and one for viewing items? In this post, I’ll show you how to create a different InfoPath view for New, Edit, and Display forms, as pictured below:
Here are the steps:
- Go to the list you want to customize (or create a new list). For this example, I’ll be customizing an Issues List.
- Select the List ribbon and, from the Customize List group, click on Customize Form.
- SharePoint will open InfoPath and load the default form. You can customize it just like you would any other InfoPath form. Just make sure you stick to browser compatible settings, because the form will be loaded using InfoPath Forms Services.
- For this sample, I’ll add a title to every form and change the colours of each form (so that we can prove that it works). Let’s treat this form as the New Item form:
- We’ll create two more views (one for Edit, and one for Display). To make things less confusing, let’s rename the view. We do this by changing the view’s properties using the following steps: switch to the Page Design ribbon, and select Properties from the Views group.
- In the View Properties dialog, change the View name to New item, then click OK. This step is optional, but it’ll make things less confusing later – trust me.
- Back on the New item view, select the entire content of the form and copy to the clipboard. We’ll paste the form’s content in a new view.
- From the Page Design gallery, click on New View from the Views group.
- Name the new view Edit view.
- In the newly created view, select all content and replace it with the content you copied from the previous view. Make your changes to the Edit view – in my case, I changed the title of the form to Edit Issue and changed the colour.
- Repeat steps 7 to 10, but this time name the newly create view Display view
- I’ll change the title and colour of the Display view
- SharePoint will automatically display the Display view in read-only mode. Since I’m a control freak, I prefer to create my own read-only view by going to every control, and converting them to Calculated value fields by right-clicking each control, select Change Control and picking Calculated value.
- The final Display Issue view look like this:
- You can add as many views as you want using the same approach, and use rules to select the appropriate view. For example, you may want to display a different view based on a user’s role. If you do, you probably don’t want users to be able to switch between views. To do so, go to the View Properties for each view, and de-select the Show on the View menu when filling out this form option.
- So far, all we did was setting up the different views for New, Edit, and Display. The next few steps will configure which view to use when displaying, editing, and creating a new item. Let’s start with the Display form; go to the File menu, then select Info and Advanced form options.
- In the Form Options dialog, select the Web Browser category. In the Display View area, select the view you want to appear when displaying an item (in our sample, it is called Display view).
- Unfortunately, to set the Edit and New views, we don’t have an easy option. We can, however, use Form Rules to change the view when the form is loaded. If the ID
field is blank, we’ll assume that the user is creating a New item. If the ID field is not blank, the user is Editing the item. To do this, switch to the Data ribbon, and click on Form Load in the Rules group.
- InfoPath will open the Rules pane (on the right side of the form). Click on New then Action.
- Name the rule Switch to New View. Then click on default condition (None – Rule runs when form is loaded) to create a new condition.
- From the Condition dialog, change myFields to Select a field or group… then pick ID from the dialog that pops-up. Click OK to return to the Condition dialog.
- Change is equal to to is blank then click OK.
- Back at the Rules pane, find Run these actions and select Add then Switch views.
- From the Rules Details dialog, select New item from the View field and click OK.
- You may be tempted to switch the view to Edit Item when the ID
is not blank, but – if you think about it – this condition would occur both when viewing an item and editing an item. It would make SharePoint switch to the Edit item view when you try to display an item, even if you did set up the Display view option step 17. Don’t do it! - All you need to do now is publish the form! To do so, select the File menu, Info then Quick Publish.
- Wait until InfoPath does its thing. You’ll get a message indicating that publishing was successful.
- Click on Open the SharePoint list in the browser to test your new forms. Here are the final results:
What gets displayed with creating a new item:
When displaying an item:
When editing an item:
That’s it! Of course, in real life, you’d probably want to customize each form a bit more than just changing the title and colour.
Hope this helps!
19 Comments
Superb, i was strugling to find out, its very usefull. thanks
Its simple and superb.
As you have made the calculated columns for Display View similarly do we have any options for the User fields to make readonly for the Display view. For the user fields its seems to be in ediing mode for Dispaly view . Its would be if you can share the contents..
Thanks In Advance
Muchas gracias, me sirvió muchísimo 🙂
Reblogged this on Tungtran.
Yes, Faeze is right: you need to change the Edit view to be the default view. The rule that checks if the ID is blank is what will toggle to the New view.
ok, I got it. Edit view should be set as default 🙂
ok, I got it. Edit view should be set as default view 🙂
I performed your tutorial, It works well for display and new item but it shows New Item view for Edit mode too.
Where dis I make a mistake?
Well done! Thanks much.
I search for hours trying to figure out how to switch the views for new, edit and view. Your instructions were awesome – just wish I had found them earlier!!! THANK YOU!
Yes it is easy to follow!
great, but somehow my edit view is not coming up
I have configured and published as you mentioned but was not able to switch to the Edit view? Any Idea why?
Great. Bookmarked
Jim
… and that’s why pee is yellow …
really good article …
all your bases are belong to us
Thank you. Did we cover search?
Hi Hugo,
This is a very nice tutorial. Steps are very clear and precise, easy to following. Well done. Thanks a lot
Derek
Thanks Hugo, Really nice posting.
It helps me a lot to put many pieces of puzzle together.
“You can add as many views as you want using the same approach, and use rules to select the appropriate view”, This is really helpful in most of business scenario, in which we need to display appropriate view based on user’s role
Christine