Web Application Generator

Labels
AJAX(112) App Studio(7) Apple(1) Application Builder(245) Application Factory(207) ASP.NET(95) ASP.NET 3.5(45) ASP.NET Code Generator(72) ASP.NET Membership(28) Azure(18) Barcode(2) Barcodes(3) BLOB(18) Business Rules(1) Business Rules/Logic(140) BYOD(13) Caching(2) Calendar(5) Charts(29) Cloud(14) Cloud On Time(2) Cloud On Time for Windows 7(2) Code Generator(54) Collaboration(11) command line(1) Conflict Detection(1) Content Management System(12) COT Tools for Excel(26) CRUD(1) Custom Actions(1) Data Aquarium Framework(122) Data Sheet(9) Data Sources(22) Database Lookups(50) Deployment(22) Designer(177) Device(1) DotNetNuke(12) EASE(20) Email(6) Features(101) Firebird(1) Form Builder(14) Globalization and Localization(6) How To(1) Hypermedia(2) Inline Editing(1) Installation(5) JavaScript(20) Kiosk(1) Low Code(3) Mac(1) Many-To-Many(4) Maps(6) Master/Detail(36) Microservices(4) Mobile(63) Mode Builder(3) Model Builder(3) MySQL(10) Native Apps(5) News(18) OAuth(9) OAuth Scopes(1) OAuth2(13) Offline(20) Offline Apps(4) Offline Sync(5) Oracle(11) PKCE(2) Postgre SQL(1) PostgreSQL(2) PWA(2) QR codes(2) Rapid Application Development(5) Reading Pane(2) Release Notes(183) Reports(48) REST(29) RESTful(29) RESTful Workshop(15) RFID tags(1) SaaS(7) Security(81) SharePoint(12) SPA(6) SQL Anywhere(3) SQL Server(26) SSO(1) Stored Procedure(4) Teamwork(15) Tips and Tricks(87) Tools for Excel(2) Touch UI(93) Transactions(5) Tutorials(183) Universal Windows Platform(3) User Interface(338) Video Tutorial(37) Web 2.0(100) Web App Generator(101) Web Application Generator(607) Web Form Builder(40) Web.Config(9) Workflow(28)
Archive
Blog
Web Application Generator
Saturday, December 15, 2012PrintSubscribe
Order Form Sample–Part 34

Let’s add a tablix that will display a list of order details.

Activate the Toolbox window by pressing Ctrl+Alt+X keyboard shortcut. Click on the Pin icon in the top right corner of the window to keep it open.

Pinning the Toolbox window to keep it open.

Drag Table item into the center section of the report to add a tablix element.

Dropping Table item onto the report template.

Mouse over the cell in the first column, second row, and click on the icon that appears in the top right corner.

Adding a data item to a table cell.

Click on ProductProductName data item from the list to add it to the cell.

Selecting ProductProductName data item.

The data item will be added to the cell, and the header will be automatically labeled. Double-click on the label text and change to “Product Name”.

Changing the header text of the column.

Add six more fields with the following labels. To add more columns, right-click on a column and press Insert Column | Right.

Field Label
UnitPrice Unit Price
Quantity Quantity
Discount Discount
ProductCategoryCategoryName Category
ProductSupplierCompanyName Company
ExtendedPrice Extended Price

The tablix must look as shown in this picture:

Table configured with columns and headers.

Click and drag on the dividers in the grey area above the columns to expand the columns. Expand the columns to take up all the space on the page. Make sure to allocate the most horizontal space to ProductProductName, ProductCategoryCategoryName, and ProductSupplierCompanyName.

Note that the report page should not exceed a width of 10”. You can display a ruler by clicking on Report | View | Ruler in the Visual Studio menu.

Table filling the available space.

Click on the first header cell. Hold Shift, and click on the last cell. On the toolbar, click on the Bold icon to make all text bold. Then click on the Foreground Color icon.

Changing the foreground color of the column header text.

Select the color “Midnight Blue”.

Choosing a different color.

Press OK to change the color of the text.

Highlight all cells in both rows. On the toolbar, activate the Border dropdown, and select No Border to turn off the default grey borders.

Turning off the default gray border of the table.

Then, activate the Border Color immediately to the left and select “Gray”. Press Bottom Border to turn on a single black border on the bottom.

Enabling a gray bottom border for the table cells.

Saturday, December 15, 2012PrintSubscribe
Order Form Sample–Part 33

Let’s prepare the report template for customization.

On the Project Designer toolbar, press Develop to open the project in Visual Studio.

In the Solution Explorer, double-click on ~\Reports\OrderDetails_report1.rdlc file.

Custom report template RDLC file selected in the Solution Explorer.

The default report template includes all the fields present in the view.

Default order report template.

Let’s start over with a clean slate. Press Ctrl+A keyboard shortcut to select all elements in the report. Right-click and press Delete.

Deleting all default elements from the report template.

The report implementation strategy requires either filtering or grouping of data.

Strategy Description
Simple Filtered Report This template requires data filtering for accurate presentation of data. It is easier to implement.
Report with Multi-Level Grouping This template groups order details first by CustomerID, and then by OrderID. The data does not have to be pre-filtered for accurate presentation. The report customization is more complex.
Saturday, December 15, 2012PrintSubscribe
Order Form Sample–Part 32

Let’s create a data controller view that will serve as a foundation for the report.

Start the Project Designer. In the Project Explorer, switch to the Controllers tab. Right-click on OrderDetails / Views node, and press New View.

Creating a new view for OrderDetails controller.

Assign the following values:

Property Value
Id report1
Label Order Report
Show in View Selector false
Create custom report template true

Press OK to create the view.

Expand OrderDetails / Fields node. Click on OrderID field node. Hold Shift,and select the last field, ExtendedPrice. Drop the fields onto OrderDetails / Views / report1 node.

Dropping all fields in OrderDetails controller onto view 'report1'.     All fields added as data fields in view 'report1'.

On the toolbar, press Browse to generate the custom report template (.RDLC) file.