Tutorial: Tab application with Grid and Chart

In this example we will see a tab-type application, where you can open other applications on the same page. For this example, 4 applications will be used: 1 form, 2 grid and the tab application.

Creating a chart

1. Create a new chart application based on table orders.

2. Open the “Graphics” option in the application menu.

3 – Select the following dimensions and metrics:

4 – In “Graph”, select the desired type.

5 – Generate the source code by clicking on the Generate Source Code button on the ScriptCase toolbar.

Creating a grid

1 – Create a new query application based on the employee table.

2 – In the “Grid Modules” options, check only the Grid module. Use the “Slide” orientation and to display only 1 line per page.

3 – In Layout >> Blocks, add a new block to the application.

4 – In “Edit Fields”, drag the fields to the desired position in the blocks, and remove the rest of the fields from the display. 

5 – Generate the source code of the application.

Creating the Posting Grid

1 – Create a new Grid application 

Use the following SQL: 

SELECT accountid, sum (valuerelease) as valuerelease

FROM releases

GROUP BY accountid

2 – In the “Grid Modules” options, check only the Grid module.

Creating a tab application

1. Create a new tab application.

2. Create folders to display in the application in Folder Settings.

3 – To add a new Tab, in the Label property, write the display name of the Tab and click on the “Add” button.

4 – Repeat the last procedure to create 2 more folders.

5 – Now it is necessary to connect the applications to the created folders. Click on the “Application Settings” item.

6 – With the first folder selected, click the Add button. On the next screen, choose the Grid created in step 2 and click the Proceed button.

7. Pass the parameters according to the following figure and click Save.

8. Select the second folder in the application settings and click Add. Select the chart created previously and click Next.

9 – Configure according to the figure below and click the Save button.

10 – Select the third folder and choose the grid created in step 3. Click the Proceed button.

11 – Configure according to the figure below and click the Save button.

12. Click to run the application.