Finally, we are ready to layout the data display portion of our Radio Shows by Type report. The first step of this phase is to layout the fields of our controlling DataItem data in such a way that we can properly group the subordinate DataItems' data.

Once again, Design the report and navigate to View | Layout so that the Visual Studio Report layout screen is displayed with the Insert ribbon visible. We are now done with the Page Heading and, from here on, all our work will be done in the body of the report design surface.

Click on the List icon in the Insert ribbon and drop a List control in the body of the report design surface. Position the control at the top left of the layout body. Because we' will define six layout lines to hold the necessary data and header controls, we may want to expand the List control and work area (though this can be done later, as needed). Follow these steps:

1. Click on the List control so that a shaded area appears to the top and left of the control.
2. Right click on the shaded area and select Tablix Properties.
3. Right click on the drop-down arrow in the Dataset Name box to set the Dataset name value to DataSet_Result. This causes the List control to reference our incoming NAV data.
4. Click on OK to save the new Tablix property setting.
5. Right click again in the List control's shaded area and select Row Group, then Group Properties as shown in the following screenshot:

6. In the Group Properties screen, select the General tab and in the Group expressions area click on Add, then in Group on: select [Code_RadioShowType], because we want our data output grouped by the Type of Radio Show as shown:

7. Click on OK to return to the report layout design surface. Click on the Table control icon, choose Insert Table and click on the List control to place the new Table. This will be the container for our Radio Show Type DataItem fields.
8. The empty control will start with two rows and three columns. As we'll only display two data fields (code and description), we only need two columns. Highlight the rightmost column (click on the body so that a shaded area appears on the left and top of the control, then click on the shaded area above the column), right click on that shaded area and chose the Delete Columns option.
9. Because this section of our report acts as a heading to subordinate sections, we will delete the Data row from the Table control and replace it with a second Header row. Once again, click on the shaded area to highlight the Data row, select the Delete Rows option, respond OK to the confirmation message, highlight the Header row, and insert a second Header row. We will now have two rows and two columns of Text boxes (cells) ready for our data.
10. From the Parameters data list in the Report Data panel, grab the Code_RadioShowTypeCaption and drop it into the top-left table cell. Drag the Description_RadioShowTypeCaption and drop it into the top-right table cell. Stretch out the cells so the data is likely to fit without wrapping to a second line.
11. Our next step is to place some data fields in the Table control. Click on the lower-left cell of the Table control. The field list icon will display. Click on the icon and we will see all the fields in the Dataset_Result:

12. Select Code_RadioShowType for the bottom-left cell and Description_RadioShowType for the bottom-right cell.

We are at another good point to save and check our work. If you are one of those people who like to do as much as possible from the keyboard, Ctrl + S, to save the RDLC; Alt + F4, to exit Visual Studio; Esc, to exit the Report Designer; Enter, to load the changed RDLC; Enter, to save and compile; and then Alt + R, to run the report. Now, you'll likely have to use your mouse to respond to the Request Page.

Don't worry about the vertical and horizontal layout of our output as long as our results make sense. We can fix the layout alignments later. When we run our report, we should get as many instances of the Radio Show type printed from our test data as we have Types of entries selected from the Playlist Header table based on any filters we applied.

Assuming our output looks pretty much like we expected (a simple list of Show Types with column headings), we can move on to the next layer of definition. This time, we will define how the Radio Show data fields will be shown, including the fact that this set of data is grouped subordinate to the Type field.

Insert another Table control in the report design surface inside the list control. Position this control below the last Table control in a position that will show its relation to the Type data records. Usually, this will involve indenting.

Click on the control to cause the shaded outer area to display. Highlight the Header row and delete it. Highlight the Data row, right click on it, and choose Insert Row - Inside Group (Above or Below doesn't matter this time). Now, to confirm if our List control is associated with the DataSet_Result, perform the following steps:

1. Right click on the List control so that a shaded area appears at the top and left of the control.
2. Right click on the shaded area and select Tablix Properties.
3. The Dataset name box should contain the value DataSet_Result.
4. Click on OK to save the Tablix property setting.

In the bottom row of our second Table control, cause the field list icon to display, then choose a field for each of the three cells (No., Show_Description, and Run_Time). In the top row, we could choose Parameter captions as we did earlier; but we may want captions that are different than those that came across from Report Designer. We could have used Labels here if we had defined them in Report Designer or we can just do the simple thing--type in the column headings we want (Show No., Name, Run Time), overwriting the default headings (doing this will not yield multi-language compliant captions). Highlight the middle column (Name) and stretch it out so a long name will display on one line rather than wrapping. Now, once again, it's time to save and test.

Our third (and final) set of data for this report will hold data from the Playlist HeaderDataItem. Right click on the grey area of the top row of the second Table control. Select Row Group | Group Properties. In the Group Properties screen, select the General tab; in the Group expressions area, click on Add; then, in Group on:, select [Code-RadioShow] because we want the next set of data output grouped by the Radio Show Code. When we return to the layout screen, we will see that the grey area next to the rows for this table will have changed from the data icon to a group brace icon that includes both of what were previously marked as data rows.

Right click on the grey area for the bottom row, choose Insert Row | Inside Group - Below. Repeat so that there are now two empty rows at the bottom of the second table area. Fill the rightmost two columns of these two rows. In the top of these two rows, insert captions from the Parameters list for PostingDate and StartTime. In the bottom row, use the field lists to insert data elements for PostingDate and StartTime. The final layout should look similar to the following screenshot:

Finally we will save our RDLC code (Ctrl + S), exit Visual Studio (Alt + F4), exit CSIDE RD (Esc, Enter), save and compile (Enter). Let's Run our report and see what we've got. While this report is not beautiful, it is serviceable, especially for a first try. One thing that we should improve before we show it to very many people is to make the formatting more attractive.

A couple of very simple changes would be to make the heading rows bold (to stand out) and format the date and time fields so they would show properly (not showing as SQL DateTime fields). Easy ways to do this in the layout screen are as follows:

1. Click on the table so that the grey outline displays. Highlight the heading row. Click on the bold icon on the top ribbon. The text for the row should now show bolded.
2. Right click on the cell for the date field. Choose Textbox Properties. From the list of property categories, choose Number, then choose Date and the preferred Date format. Do essentially the same thing for the time field.

The result after some minor formatting should look similar to the following screenshot: