Skip to content

Commit 5676286

Browse files
BrianDXalbertov05
andauthored
22.1 reports (#170)
* Bind a Report to a Join-Based Federated Data Source * Bind a Report to a Union-Based Federated Data Source * Bind a Report to a Transformation-Based Data Source * Bind a Report to a Federated Master-Detail Data Source * Interactive Reports for web * fix toc * Add note * remove excessive images * Apply suggestions from code review Co-authored-by: Albert Totten <[email protected]> * Update interface-elements-for-web/articles/report-designer/bind-to-data/bind-a-report-to-a-federated-master-detail-data-source.md Co-authored-by: Albert Totten <[email protected]> * Update interface-elements-for-web/articles/report-designer/bind-to-data/bind-a-report-to-a-union-based-federated-data-source.md * fix as per review * Update interface-elements-for-web/articles/report-designer/create-reports/master-detail-reports-with-detail-report-bands.md Co-authored-by: Albert Totten <[email protected]> Co-authored-by: Albert Totten <[email protected]>
1 parent fd7bfce commit 5676286

File tree

77 files changed

+465
-26
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

77 files changed

+465
-26
lines changed

interface-elements-for-web/articles/report-designer/bind-to-data.md

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,4 +10,8 @@ The following topics illustrate how to bind a report and its controls to data:
1010
* [Specify Query Parameters](bind-to-data/specify-query-parameters.md)
1111
* [Bind a Report to JSON Data](bind-to-data/bind-a-report-to-json-data.md)
1212
* [Bind a Report to an Object Data Source](bind-to-data/bind-a-report-to-an-object-data-source.md)
13+
* [Bind a Report to a Join-Based Federated Data Source](bind-to-data/bind-a-report-to-a-join-based-federated-data-source.md)
14+
* [Bind a Report to a Union-Based Federated Data Source](bind-to-data/bind-a-report-to-a-union-based-federated-data-source.md)
15+
* [Bind a Report to a Transformation-Based Federated Data Source](bind-to-data/bind-a-report-to-a-transformation-based-data-source.md)
16+
* [Bind a Report to a Federated Master-Detail Data Source](bind-to-data/bind-a-report-to-a-federated-master-detail-data-source.md)
1317

Lines changed: 77 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,77 @@
1+
---
2+
title: Bind a Report to a Federated Master-Detail Data Source
3+
owner: Boris Zaitsev
4+
---
5+
# Bind a Report to a Federated Master-Detail Data Source
6+
7+
This topic describes how to create a federated data source that retrieves data from multiple data sources and sets the master-detail relationship between the queries.
8+
9+
## Create a Report and Data Sources
10+
11+
1. [Create a new blank report](../../../articles/report-designer/report-designer-tools/report-wizard/empty-report.md).
12+
13+
2. [Add a SQL data source](../../../articles/report-designer/bind-to-data/bind-a-report-to-a-database.md) that retrieves data from the `Customers` table of the **Northwind** database.
14+
15+
3. [Add a JSON data source](../../../articles/report-designer/bind-to-data/bind-a-report-to-json-data.md) that retrieves product data from the **nwind.json** file. The **nwind.json** file is included in the sample web project if you create it from the Visual Studio template.
16+
17+
The Field List pane in the End-User Report Designer appears as follows:
18+
19+
![](../../../images/eurd-web-federated-datasource-master-detail-field-list-before.png)
20+
21+
## Create Data Federation
22+
23+
1. Invoke the designer [menu](../report-designer-tools/menu.md) and click **Add Data Source**.
24+
25+
![](../../../images/eurd-web-data-source-menu.png)
26+
27+
28+
1. Select **Data Federation** in the invoked [Data Source Wizard](../report-designer-tools/data-source-wizard.md) and click **Next**.
29+
30+
![](../../../images/eurd-web-data-source-wizard-select-data-federation.png)
31+
32+
1. On the next page, enable check boxes for the SQL data source's table and the JSON data source. The selected items are included in data federation as separate queries.
33+
34+
![](../../../images/eurd-web-data-federation-wizard-select-source-queries.png)
35+
36+
1. Click the **+ (plus) element** command element in the **Configure master-detail relationships** pane, and specify the master-detail relationship as shown below:
37+
38+
![](../../../images/eurd-web-data-federation-master-detail-relationship.png)
39+
40+
Click **Finish** to complete the Data Source Wizard.
41+
42+
1. The Data Source Wizard creates a new **FederationDataSource** that includes two queries with a master-detail relationship. The [Field List](../../../articles/report-designer/report-designer-tools/ui-panels/field-list.md) reflects the data source's structure.
43+
44+
![](../../../images/eurd-web-data-federation-master-detail-field-list.png)
45+
46+
The Data Source Wizard specifies query names as follows:
47+
* If the initial data source contains data at the root level (as the JSON data source), the federated query's name is equal to the data source name.
48+
* If the initial data source contains one or more queries (as the SQL data source), the federated query's name consists of the data source name and query name separated by an underscore.
49+
50+
## Manage the Federation Data Source
51+
52+
You can rename the query in the **Manage Queries** dialog. To invoke the dialog, click the **Manage Queries** button.
53+
54+
![](../../../images/eurd-web-data-federation-master-detail-rename-query.png)
55+
56+
The **Manage Queries** dialog appears.
57+
58+
![](../../../images/eurd-web-data-federation-master-detail-manage-queries-dialog.png)
59+
60+
Click the query name in the list to invoke the text editor and change the name.
61+
62+
![](../../../images/eurd-web-data-federation-master-detail-manage-queries-dialog-change-name.png)
63+
64+
The **Manage Queries** dialog allows you to add, modify, or delete queries.
65+
66+
To add a new query, click the **Add query** drop-down in the bottom left corner and select the
67+
query type: Join, Union, or Transform. The Query Builder is invoked to help you construct a new query.
68+
69+
To edit a query, select the query name in the list and click the **Edit button** that appears in the selected item. The Query Builder window is invoked to help you edit a query.
70+
71+
To delete a query, select the query name in the list and click the **Delete button** that appears in the selected item. The query is deleted without confirmation.
72+
73+
> [!NOTE]
74+
> Once you rename the query, update the **Data Member** properties for the DetailReport band and the Report itself.
75+
76+
77+
Lines changed: 114 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,114 @@
1+
---
2+
title: Bind a Report to a Join-Based Federated Data Source
3+
owner: Boris Zaitsev
4+
---
5+
# Bind a Report to a Join-Based Federated Data Source
6+
7+
This topic describes how to create a federated data source that joins data from multiple data sources into a single query.
8+
9+
## Create a Report and Data Sources
10+
11+
1. [Create a new blank report](../../../articles/report-designer/report-designer-tools/report-wizard/empty-report.md).
12+
13+
2. [Add a SQL data source](../../../articles/report-designer/bind-to-data/bind-a-report-to-a-database.md) that retrieves data from the `Invoices` view of the **Northwind** database.
14+
15+
3. [Add a JSON data source](../../../articles/report-designer/bind-to-data/bind-a-report-to-json-data.md) that retrieves customer data from the [https://raw.githubusercontent.com/DevExpress-Examples/DataSources/master/JSON/customers.json](https://raw.githubusercontent.com/DevExpress-Examples/DataSources/master/JSON/customers.json) location.
16+
17+
![](../../../images/eurd-web-federated-datasource-json-datasource.png)
18+
19+
## Create Data Federation
20+
21+
1. Invoke the designer [menu](../report-designer-tools/menu.md) and click **Add Data Source**.
22+
23+
![](../../../images/eurd-web-data-source-menu.png)
24+
25+
26+
1. Select **Data Federation** in the invoked [Data Source Wizard](../report-designer-tools/data-source-wizard.md) and click **Next**.
27+
28+
![](../../../images/eurd-web-data-source-wizard-select-data-federation.png)
29+
30+
1. On the next page, click the **+ (plus) button** and select **Join** to add a Join query.
31+
32+
![](../../../images/eurd-web-data-federation-wizard-add-join-query.png)
33+
34+
1. In the invoked [Query Builder](../../../articles/report-designer/report-designer-tools/query-builder.md), drag and drop the table from the SQL data source onto the design surface.
35+
36+
![](../../../images/eurd-web-data-federation-query-builder-drop-table.png)
37+
38+
1. Drag and drop the JSON data source onto the design surface.
39+
40+
![](../../../images/eurd-web-data-federation-query-builder-drop-json-table.png)
41+
42+
1. Click a field in one table and drag it to the related field in another table to create a Join relationship.
43+
44+
![](../../../images/eurd-web-data-federation-query-builder-create-join-relationship.png)
45+
46+
1. Select the line that indicates a relationship and click the Edit button in the upper right corner of the design surface to invoke the Relation Properties editor.
47+
48+
![](../../../images/eurd-web-data-federation-query-builder-relation-properties-editor.png)
49+
50+
The editor allows you to change the join type and operator.
51+
52+
1. Select the data fields that you want to include in the result set.
53+
54+
![](../../../images/eurd-web-data-federation-query-builder-select-fields.png)
55+
56+
You can specify a different name for a field. Click the field's **Alias** cell and enter the field name.
57+
58+
![](../../../../images/eurd-data-federation-query-builder-specify-alias.png)
59+
60+
1. Click the **+ (plus) button** to add a field to the query. Click the field's **f-button** to switch to the Expression edit mode.
61+
62+
![](../../../images/eurd-data-federation-query-builder-f-button.png)
63+
64+
1. Click the **ellipsis (...)** in the field to invoke the [Expression Editor](../use-expressions.md) and construct an expression for the field value:
65+
66+
```
67+
[Invoices.UnitPrice] * [Invoices.Quantity]
68+
```
69+
70+
![](../../../images/eurd-web-data-federation-query-builder-construct-expression.png)
71+
72+
Click **OK** to close the Expression Editor.
73+
74+
1. Specify _Amount_ as the alias for the newly created calculated field.
75+
76+
![](../../../images/eurd-web-data-federation-query-builder-calculated-field.png)
77+
78+
Click **OK** to close the Query Builder.
79+
80+
1. Click **Finish** to complete the Data Source Wizard.
81+
82+
![](../../../images/eurd-web-data-federation-data-source-wizard-finish.png)
83+
84+
The Wizard creates a new **FederationDataSource** that includes a single query.
85+
86+
## Manage the Federation Data Source
87+
88+
The federation data source is shown in the Field List.
89+
90+
![](../../../images/eurd-web-data-federation-data-source-field-list.png)
91+
92+
When you create a federated query, its name is set to the name of the first table added to the query. You can rename the query in the **Manage Queries** dialog. To invoke the dialog, click the **Manage Queries** button.
93+
94+
![](../../../images/eurd-web-data-federation-rename-query.png)
95+
96+
The **Manage Queries** dialog appears.
97+
98+
![](../../../images/eurd-web-data-federation-manage-queries-dialog.png)
99+
100+
Click the query name in the list to invoke the text editor and change the name.
101+
102+
![](../../../images/eurd-web-data-federation-manage-queries-dialog-change-name.png)
103+
104+
The **Manage Queries** dialog allows you to add, modify, or delete queries.
105+
106+
To add a new query, click the **Add query** drop-down in the bottom left corner and select the query type: Join, Union, or Transform. The Query Builder is invoked to help you construct a new query.
107+
108+
To edit a query, select the query name in the list and click the **Edit button** that appears in the selected item. The Query Builder window is invoked to help you edit the query.
109+
110+
To delete a query, select the query name in the list and click the **Delete button** that appears in the selected item. The query is deleted without confirmation.
111+
112+
> [!NOTE]
113+
> Once you rename the query, update the report's **Data Member** property.
114+
Lines changed: 128 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,128 @@
1+
---
2+
title: Bind a Report to a Transformation-Based Data Source
3+
author: Boris Zaitsev
4+
---
5+
6+
# Bind a Report to a Transformation-Based Data Source
7+
8+
If the data source contains hierarchical data, it can be transformed to flatten nested fields and display them as separate fields. If the data column is an array, you can unfold its values and display a new row of data for each element of the array.
9+
10+
The following image illustrates the transformation applied to a complex JSON data source.
11+
12+
![](../../../images/eurd-web-federated-data-source-transformation.png)
13+
14+
This help topic describes how to use the **Transformation** query of the **Federation Data Source** to flatten a JSON Data Source that contains nested data (collection property).
15+
16+
## Create a Report and Data Sources
17+
18+
1. [Create a new blank report](../../../articles/report-designer/report-designer-tools/report-wizard/empty-report.md).
19+
20+
1. [Add a JSON data source](../../../articles/report-designer/bind-to-data/bind-a-report-to-json-data.md) that uses the following JSON string:
21+
22+
```
23+
[
24+
{
25+
"CategoryId": 1,
26+
"CategoryName": "Beverages",
27+
"Description": "Soft drinks, coffees, teas, beers, and ales",
28+
"Products": [
29+
{
30+
"ProductId": 1,
31+
"ProductName": "Chai",
32+
"SupplierId": 1,
33+
"CategoryId": 1,
34+
"QuantityPerUnit": "10 boxes x 20 bags",
35+
"UnitPrice": 18.0000,
36+
"UnitsInStock": 39,
37+
"UnitsOnOrder": 0,
38+
"ReorderLevel": 10,
39+
"Discontinued": false,
40+
"Supplier": null
41+
},
42+
{
43+
"ProductId": 2,
44+
"ProductName": "Chang",
45+
"SupplierId": 1,
46+
"CategoryId": 1,
47+
"QuantityPerUnit": "24 - 12 oz bottles",
48+
"UnitPrice": 19.0000,
49+
"UnitsInStock": 17,
50+
"UnitsOnOrder": 40,
51+
"ReorderLevel": 25,
52+
"Discontinued": false,
53+
"Supplier": null
54+
}
55+
]
56+
},
57+
{
58+
"CategoryId": 2,
59+
"CategoryName": "Condiments",
60+
"Description": "Sweet and savory sauces, relishes, spreads, and seasonings",
61+
"Products": [
62+
{
63+
"ProductId": 3,
64+
"ProductName": "Aniseed Syrup",
65+
"SupplierId": 1,
66+
"CategoryId": 2,
67+
"QuantityPerUnit": "12 - 550 ml bottles",
68+
"UnitPrice": 10.0000,
69+
"UnitsInStock": 13,
70+
"UnitsOnOrder": 70,
71+
"ReorderLevel": 25,
72+
"Discontinued": false,
73+
"Supplier": null
74+
},
75+
{
76+
"ProductId": 4,
77+
"ProductName": "Chef Anton's Cajun Seasoning",
78+
"SupplierId": 2,
79+
"CategoryId": 2,
80+
"QuantityPerUnit": "48 - 6 oz jars",
81+
"UnitPrice": 22.0000,
82+
"UnitsInStock": 53,
83+
"UnitsOnOrder": 0,
84+
"ReorderLevel": 0,
85+
"Discontinued": false,
86+
"Supplier": null
87+
}
88+
]
89+
}
90+
]
91+
```
92+
The created JSON data source is displayed in the Field List pane:
93+
94+
![](../../../images/eurd-web-federated-datasource-transformation-json-datasource.png)
95+
96+
## Create Data Federation
97+
98+
1. Invoke the designer [menu](../report-designer-tools/menu.md) and click **Add Data Source**.
99+
100+
![](../../../images/eurd-web-data-source-menu.png)
101+
102+
103+
1. Select **Data Federation** in the invoked [Data Source Wizard](../report-designer-tools/data-source-wizard.md) and click **Next**.
104+
105+
![](../../../images/eurd-web-data-source-wizard-select-data-federation.png)
106+
107+
1. On the next page, click the **+ (plus) button** and select **Transform** to add a Transformation query.
108+
109+
![](../../../images/eurd-web-data-federation-wizard-add-transformation-query.png)
110+
111+
1. The invoked [Query Builder](../../../articles/report-designer/report-designer-tools/query-builder.md) displays the columns that you can transform.
112+
113+
![](../../../images/eurd-web-data-federation-transformation-query-builder.png)
114+
115+
1. Select the **Transform** check box next to the column you need to unfold and flatten. You can specify the aliases for the generated columns.
116+
117+
![](../../../images/eurd-web-data-federation-transformation-query.png)
118+
119+
Click **OK** to close the Query Builder window.
120+
121+
1. Click **Finish** to create the data source.
122+
123+
![](../../../images/eurd-web-data-federation-finish-data-source.png)
124+
125+
The **Field List** displays the created Federation Data Source.
126+
127+
![](../../../images/eurd-web-data-federation-result.png)
128+

0 commit comments

Comments
 (0)