Grid
  • 5 Minutes to read
  • Contributors

    Grid


      Article Summary

      The Grid field help CDs organize the data and information into a table-like format within the form.

      Grid - Properties

      Field Name: This allow CDs to provide a unique name to the field for its identity.

      Label Name: This allow CDs to provide the final visible name of the field to the end-users.

      Add Grid Elements: This allow CDs to create a table inside the Grid field. In real-time application grid field show cases as a table-like format. (Checkout the GIF below for better understanding)

      Stack Headers: The Stack Headers allows you to organize and visually group your fields under a common header. It helps in structuring the layout of your form by grouping related fields together, making it easier for users to understand and navigate the form.

      EXAMPLE
      Suppose you have a form for collecting user information. Instead of having all the fields displayed in a single list, you can use stack headers to group related fields. You might have a stack header named "Personal Information" under which you stack fields like "Name," "Email," and "Phone Number." Another stack header named "Address Details" can contain fields like "Street Address," "City," and "Postal Code." This way, users can easily identify and fill in the relevant sections of the form.

      Don't Show: This allows CDs to hide the field.

      IMPORTANT

      The field doesn't appear in the real-time application upon selecting don't show.

      Disable Add: This allow CDs to disable the add icon from the grid table in the preview, as users cannot add records to the Table.

      Disable Delete: This allow CDs to restrict users deleting the data.

      Hide Delete: This allow CDs to make the delete button invisible to the users.

      Disable Upload: This allow CDs to disable uploading the data to the grid through excel or any format by the users.

      Fit to GridThe records that have been added will be displayed in the Grid Table in the size that fits.

      Show Aggregates: This only works with number fields inside the grid. When you enable Show Aggregates for a grid field and enter the grid, and upon selecting a number field inside the grid. CDs can choose from options like sum, average, count, maximum, and minimum to apply the desired aggregate function to the selected number field.

      Adjust Column Width: With this CDs can adjust the length of the columns.

      Grid Visual Settings: With this CDs can align the Grid records in required alignment. It can be applied to both Header and the Content in it.

      Choose columns in Grids: This allow CDs to choose the required columns to appear while viewing grid tables.

      Field Themes

      Font Properties

      Field Label Color: CDs can choose or change the color of the field.

      Field Label Size: CDs can change the size of the field to small, medium, large, or custom.

      Field Label Style: CDs can apply styles to the like bold or italic to the field name.

      Field Value Color: CDs can add or change the color of the field's value.

      Field Value Size: CDs can change the size of the field value to small, medium, large, or custom.

      Field Value Style: CDs can apply styles like bold or italic to the entered field value.

      Grid Table in the Application:

      Add Record:

      • Click on the Add Record button to add a new record manually.
      • A new empty row is added to the below-existing grid, which allows the user to add new values to the grid elements manually.

      • You can add as many rows as you want to based on the requirements by clicking on Add Record.

      Download to Excel:

      • Clicking on the Download to Excel button download the data from the grid table to an excel sheet.

      • A Download Excel pop-up is visible on the screen, as shown below.

      • You can see two buttons in the pop-up, Download All Data and Download Sample.
      • You can click on the Download All data button to download the Grid into an excel sheet with all the data captured into the excel sheet.
      • You can click on the Download Sample button to get a sample excel sheet.

      Upload Excel:

      • To upload an excel sheet, you need to download the sample grid file, use the Download to Excel option, add the data to the excel file, and then upload it using the Upload Excel option.
      IMPORTANT
      The header names of both the grid table and the excel table must be same. 
      • Click on the Upload Excel button.

      • You can see an open window pop-up on the screen to select the excel file, as shown below.

      • Select the excel file and click on the open button to upload it.

      • The data gets uploaded from the excel sheet to the Grid.

      Data capturing fields for Grid

      Form Builder Elements are used in Grid to create a grid table.

      The element fields in the application Form Builder and the grid Form Builder are the same except for Serial Number and Default Column in Basic Elements.

      NOTE
      You can refer to the Application Form Builder to get an understanding on the element fields and their uses.
      NOTE
      Serial Number is the only extra form element which is present in the grid form element, which is explained below.

      Serial Number

      This element is to set the serial number for the records in the Grid. It automatically updates the serial number to the grid records.

      Properties for the serial Number:

      Field Name: This allow CDs to provide a unique name to the field for its identity.

      Label Name: This allow CDs to provide the final visible name of the field to the end-users.

      Don't Show: This allow CDs to hide the field.

      IMPORTANT
      The hidden field doesn't appear in the real-time application upon selecting Don't Show.

      Default Column

      It has a list of values, you can set default values to the grid element, but it is difficult to get as many rows as the Number of default values set.

      Field Name: This allow CDs to provide a unique name to the field for its identity.

      Label Name: This allow CDs to provide the final visible name of the field to the end-users.

      Custom choices: This allows CDs to define the list of choices you want to display in the drop-down.

      Pre-defined choices: These are the pre-defined choices in a Look-up.

      Default Value: This allow CDs set a default value assigned to the field which later can be overridden by app users.

      Don't Show: This allow CDs to hide the field.

      IMPORTANT
      The hidden field doesn't appear in the real-time application upon selecting Don't Show.





      Was this article helpful?