---
title: "Advanced Table Design in Lasernet"
slug: "advanced-table-design-in-lasernet"
description: "Lasernet provides built-in tools in order to create tables. This article describes some advanced techniques."
tags: ["Conditional Area", "Region", "Tables", "Row shading", "Scripts", "Lasernet 9 ", "Lasernet 7"]
updated: 2024-06-25T08:55:01Z
published: 2024-06-25T08:55:01Z
canonical: "kb.lasernetgroup.com/advanced-table-design-in-lasernet"
---

> ## Documentation Index
> Fetch the complete documentation index at: https://kb.lasernetgroup.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Advanced Table Design in Lasernet

Lasernet provides built-in tools in order to create tables. How to use these tools is detailed in the standard manuals that are installed with the product such as the Form Editor manual.

## Lasernet 9 or Newer

### Apply Alternating Row Shading

Row shading can be applied to a pre-existing table by performing the following steps:

1. Select the pattern and set it to **Odd**/**Even** under the **Alternating** tab.

![](https://cdn.document360.io/c831ef63-c6b3-48ee-b443-3e33644e4e2e/Images/Documentation/image-1QG6H857.png)

1. Open the **Table Properties** and select the **Body** tab.
2. Select the **Odd** and **Even** colours needed for each row, click the **Apply to all columns** button and the **Apply to all pages** button to apply to all columns and all pages.

![](https://cdn.document360.io/c831ef63-c6b3-48ee-b443-3e33644e4e2e/Images/Documentation/1616413874700.png)

The following is the result:

![](https://cdn.document360.io/c831ef63-c6b3-48ee-b443-3e33644e4e2e/Images/Documentation/1616413875946.png)

## Lasernet 7 or Newer

### Apply Alternating Row Shading via Scripts

The following image is a table designed in Lasernet using a shading row script:

![](https://cdn.document360.io/c831ef63-c6b3-48ee-b443-3e33644e4e2e/Images/Documentation/1616413874838.png)

This will use shapes, regions, and scripts.

1. Add the following function to a script:

```plaintext
{
logger.logEvent(5000, "obj = " + obj);
logger.logEvent(5000, "fillColour = " + fillColour);
logger.logEvent(5000, "lineColour = " + lineColour);
logger.logEvent(5000, "Current Line = " + Line);
if (Line % 2 === 0)
{
logger.logEvent(5000, "**EVEN ROW IDENTIFIED**");
logger.logEvent(5000, "Applying row shading: ");
obj[Line].backgroundColor = "0x" + fillColour;
if (lineColour != "")
{
obj[Line].color = "0x" + lineColour;
}
}
else
{
logger.logEvent(5000, "**ODD ROW IDENTIFIED**");
}
}
```

1. Create a Region in which the table data will output and then create a pattern to capture the data to be displayed in a table.
2. Configure the pattern to output in the newly created region and arrange the data on the output pane so that the columns are in the required order and the text aligned as desired.

#### Edit the Properties

Use the **Shapes** tool to create a rectangle.

1. Instead of drawing the rectangle on the output pane, click one of the lines of the pattern on the input pane. A rectangle should be created for each line in the pattern.
2. Edit the properties of the rectangle and go to the **Output** tab.
3. Adjust the size and position so that the rectangles line up exactly with each row and extend the full width of the table. The height of a line is usually 5mm.
4. Change the **Fill Color** to the color for the odd rows (for instance, 1,3,5,7, etc) to appear.
5. Change the **Line Color** to the color required for the table to appear.
6. Set the **Object Name** (for example, table1) at the top of the window and click **OK**.

The rows of the table are now shaded in the same color.

1. Edit the properties of the rectangle and click the **Input** tab.
2. Select the **Script** **> Active** box so that a script can be run against this object.

#### The Script Box

1. In the script box, call the script **applyRowShading()**.

The script accepts parameters for **Object Name**, **Fill Color**, and **Line Colour**.

**Object Name**: the name of the rectangle that was set earlier, in this case, **table1**.

**Fill Color**: this must be a hexadecimal representation of the color to use as the background for even rows (2,4,6,8 etc.). For example, **FEF6FA**.

**Line Color**: this must be a hexadecimal representation of the color selected as the line color for rectangles earlier. For example, **FFFFFF**.

In this example, we would write, in the script box, **applyRowShading(table1, FEF6FA, FFFFFF)**;

1. Click **Ok**.
2. Now run the scripts on the page. The rows should alternate in color.

### Ensure the Header Values Remain on Every Page

Tables can be applied to a Conditional Area or a Region. The advantage of using a region is that the table title can stay at the top of the table without being affected by other content on either side of it.

In this example, we will apply a header to a table that spans multiple pages. We first need to create a region:

1. Right-click the Output area, select **Conditional Area** from the list, and under the **Regions** tab, click **Add**.
2. Create a Region and ensure the pattern is set to output to the region.

![](https://cdn.document360.io/c831ef63-c6b3-48ee-b443-3e33644e4e2e/Images/Documentation/1616413876101.png)

1. Click the **Table** option in the left toolbar and select **Apply to Region**.

![](https://cdn.document360.io/c831ef63-c6b3-48ee-b443-3e33644e4e2e/Images/Documentation/image-S9RJIBG8.png)

This table has a header at the start, but so far, there is no header on the next page.

![](https://cdn.document360.io/c831ef63-c6b3-48ee-b443-3e33644e4e2e/Images/Documentation/image-1E8A715C.png)

1. Double-click a title to display the **Edit Rearrange** window and select the **Position** tab.
2. In the **Relative** section, set the following from two of the drop-down options:

**Relative to: Top of region**

**Region:** The region you had created previously

1. Select the **All pages** checkbox.

![](https://cdn.document360.io/c831ef63-c6b3-48ee-b443-3e33644e4e2e/Images/Documentation/image-ECOWO99Y.png)

The title will now be set at the top of each page for that region:

![](https://cdn.document360.io/c831ef63-c6b3-48ee-b443-3e33644e4e2e/Images/Documentation/image-GJ6L8ZE8.png)

This can be completed by doing the same to the other titles and by adding some shapes to add the table box. The shapes will need the same position settings as the previous step.

![](https://cdn.document360.io/c831ef63-c6b3-48ee-b443-3e33644e4e2e/Images/Documentation/image-NR0VCNU2.png)

### Add a New Column via the Table Tool

In this example, some new data has been added that needs to be included in the table.

1. Position the mouse pointer over the column line, right-click, and select I**nsert Column**.

![](https://cdn.document360.io/c831ef63-c6b3-48ee-b443-3e33644e4e2e/Images/Documentation/image-E24ZGK3A.png)

1. Drag the column across to cover the new data.

![](https://cdn.document360.io/c831ef63-c6b3-48ee-b443-3e33644e4e2e/Images/Documentation/image-YW5618ZR.png)

Now the table has an extra column:

![](https://cdn.document360.io/c831ef63-c6b3-48ee-b443-3e33644e4e2e/Images/Documentation/1616413875377.png)

### Merge Columns via the Table Tool

To use the **Merge Column** option to merge two columns together, right-click the shared edge between two columns and click **Merge Columns**.

![](https://cdn.document360.io/c831ef63-c6b3-48ee-b443-3e33644e4e2e/Images/Documentation/image-OFBJ6QUY.png)

### Adjust the Column Dividing Line via the Table Tool

With the table set up, the column dividers can be adjusted to match the data by clicking on the line and moving it.

![](https://cdn.document360.io/c831ef63-c6b3-48ee-b443-3e33644e4e2e/Images/Documentation/1616413875643.png)

The color/width of each column line can be adjusted. To do this, follow these steps:

1. Right-click the table to display the **Table Properties** window and select the **Body** tab.

Column 1 of 4 is displayed in the following example.

To choose the required column, select either the **Previous Column** or the **Next Column** buttons.

The settings can be applied to all columns by using the **Apply to all columns** button.

1. Select the required width by entering a value in the **Width** field.

![](https://cdn.document360.io/c831ef63-c6b3-48ee-b443-3e33644e4e2e/Images/Documentation/image-TXY4FLTJ.png)

1. Use the **Fill** section to determine the line colors of borders, and then click **Ok**.