Save the Date! Using Horizontal Repeating Sections

  • Article

InfoPath 2007 introduces a new flavor of the repeating section control - horizontal repeating section. It is useful when you want to present or edit repeating data in a structured format. When new items are added, they show up side-by-side with the existing items instead of one on top of the other.

 

Horizontal repeating section is a new building block for layouts. In my previous post about horizontal repeating tables, we discussed how a horizontal repeating table is a combination of a horizontal repeating section and layout tables. You can make your own new layouts by using this new control.

 

For example, one cool use of a horizontal repeating section is a "calendar" - style form:

 

Play with it!

Download the form template and try a few things (requires InfoPath 2007, and save it to your computer before opening it):

  1. Switch to a different month by using a dropdown on top of the form.
  2. Add a note for a day.
  3. Add a note with an exclamation sign (i.e. "presentation!") - notice the day turning red.
  4. Switch views to the summary view, and observe all appointments as a flat list.
  5. Open the form template in design view, and view its logic by going to Tools | Logic Inspector.

 

How it's done

In this form, each day in the calendar is displayed by using a horizontal repeating section; only the header ("Monday, Tuesday, Wednesday…") is static. To accomplish this, we are using several powerful tricks:

 

  1. Calendar generation is completely dynamic. To generate a view of a different month, we are setting the following fields in the form under myFields/currentMonth:

    • firstDay [date field in XML format (YYYY-MM-DD); set to the first day of the month that you want to view the calendar for - i.e. for May 2007, set to "2007-05-01"]
    • numberOfDays [integer; number of days in the month that you want to present; i.e. for May 2007, set to "31"]
    • mondayOffset [integer; weekday of first day of the month; Sunday=0, Monday = 1, Tuesday = 2, etc. I.e. for May 2007 that starts on Tuesday, set to "2"]

    Note that if you wanted to extend this calendar to show additional months, you could do so by adding rules to set these parameters for different months. It's also easy to move this logic to a web service or form code - thus eliminating the need to maintain a static list of months.  

  2. Horizontal Repeating Sections wrap when placed inside a table. The wrapping point is determined by table width. This allows us to set up a 7-day-long week.

  3. Conditional formatting works just as expected on horizontal repeating sections. This allows us to highlight today's date, set red background for days marked with an exclamation sign, and set correct background color for weekends.

  4. Default values help us create a necessary number of instances of the horizontal repeating section to cover for the longest month, even if it starts on Saturday. We need 6 instances to cover for "blank" days before the first day of the month, plus a maximum of 31 days in a month = 37 instances. To accomplish this, you can follow the technique from this article.

  5. Rules provide a mechanism for month selection: when a month is selected from the dropdown on top of the form, correct values are set for nodes under myFields/currentMonth.

 

Of course, there are many uses beyond a calendar, otherwise we would have just built a calendar control, but we couldn't resist sharing this example because it shows off so many tricks.

 

Alex Weinstein

Program Manager

Calendar.xsn