Wednesday, 1 May 2013

SharePoint 2010: Howto start customize list form (New/Edit/View) using InfoPath Designer 2010

English
In SharePoint 2010 there we have more option to customize list form. For instance, you can use SharePoint Designer 2010 or InfoPath Designer 2010. Since modifying list form using SPD is already exist in previous version. I will just show you how to customize list form using InfoPath Designer 2010.
When customizing list form using InfoPath Designer 2010, you will get all form designer benefit. For example, you can define the field validation rules, parent-child relation etc. And bet what, the process is straight forward. In this very basic how-to, I will demonstrate how to start customize list form using InfoPath Designer 2010. I will create an Book List with “Title” – “Author” – “Status” column. In the New form, I will only show “Title” and “Author” – while in Edit form, “Title” and “Author” will be readonly, but “Status” is editable.
How to customize list form using InfoPath Designer 2010.
  1. Prepare the custom list.

    Prepare custom “Book List” with 3 columns: “Title” – “Author” – “Status”. “Status” field is choice “Available” – “In Used” – “Missing”. After creating the list and preparing columns, we can start to use the list and add a new item in this form.
  2. Start InfoPath Designer
    Start InfoPath Designer and select to design SharePoint List form.

    Type in the SharePoint site URL

    And then select the Book List from the list of available data.

    Finally, click on Finish.
  3. When the form editor open , you can start to edit the New form. I add a title “Book List Entry” and delete the “Status” row.

    And here is the result:
  4. Add “Edit Form” view in the designer, and set Title and Author as readonly.

    Type-in the view title.

    Design the form – add “Status” column in the form.

    Set “Title” and “Author” textbox property to “ReadOnly”

  5. Publish the form to the list.
  6. Configure the “Book List” to use designated form.
    Open the list setting page, and expand context menu for the Forms.

    Since the first view will be the default – our interest is only to the “(Item) Edit Form”. Click on (Item) Edit Form link, and change the Form view.
    You will realize that now you are seeing form services in web part.

    Click on Web Parts Tools tab, and then click on Web Part Properties.

    In the Web Part Properties, select the designated view.
  7. And here we go with the custom “New Form” and “Edit Form” for the list.
    New Form.

    Edit Form.

No comments:

Post a Comment