Data Grid Controls: Organizing and Managing POS Data

Data Grid Controls: Organizing and Managing POS Data

Overview

This article explores how to set up and customize the Data Grid Control effectively.




Creating a Data Grid Control

1. Navigation Steps

  • Step 1:
    Go to Home > Retail. Under the POS Interface & Controls section, click Data Grid Control.
    → This opens the Data Grid Control List View, displaying all existing controls.


  • Step 2:
    Click Add Data Grid Control at the top right.
    → This opens the New Data Grid Control screen where configuration details can be entered.
    → Fill in mandatory fields and click Save to apply changes.
    Example: A Customer Search Data Grid Control configuration.




2. Data Grid Control Screen Fields

Identification

  • Control ID
    Unique identifier used to reference a control displaying tabular data (lookups, journal grids, etc.).


  • Control Name
    Descriptive label used for managing controls within the POS interface.




Visual Formatting

  • Odd Row Back Color / Even Row Back Color
    Alternating row background colors improve readability.


  • Grid Line Color
    Defines vertical/horizontal line color between columns and rows.


  • Table Border Color
    Sets the outer border color of the entire table.


  • Table Border Thickness
    Customizes border width in pixels.




Layout Configuration

  • Header Height
    Pixel value defining header row height.


  • Row Height
    Pixel value determines space for each data row.


  • Header Padding / Row Padding
    Defines space between content and cell boundaries for enhanced readability.


  • Show Vertical Grid Lines
    Enables column separation for clarity.


  • Show Horizontal Grid Lines
    Enables row separation for clarity.




Selection Modes

  • Select: Single
    Allows selecting one item at a time—deselects previous selections.


  • Select: Multiselect
    Allows batch selection using CTRL/CMD or SHIFT keys.


  • Row Selectable
    Enables or disables row interaction based on conditions.




Functional Context

  • Reference DocType
    Identifies the target document type (e.g., Sales Orders, Invoices).


  • Properties (Template)
    Allows field-level editing via the pencil icon, accessed from each row.




3. Advanced Styling (CSS)

Header Advance CSS Style

  • Custom Fonts and Colors
    Aligns header aesthetics with branding.


  • Padding and Margins
    Improves text layout and spacing.


  • Hover Effects
    Adds interactivity and feedback.


  • Alignment / Borders / Backgrounds
    Refines visual hierarchy and distinction.


  • Responsive Design
    Ensures usability across devices and screen sizes.




Row Advance CSS Style

  • Custom Fonts and Colors
    Tailors row aesthetics to match branding.


  • Padding and Margins
    Creates breathable, legible content zones.


  • Hover Effects
    Improves UX through interaction cues.


  • Conditional Styling
    Highlights rows based on specific criteria.


  • Responsive Design
    Maintains consistency across form factors.




    • Related Articles

    • Information Controls: Displaying Critical Transaction Data

      ? What Is Information Control in iVendNext? It's the set of rules that manage how information flows in iVendNext — making sure data is captured correctly, stored safely, and only accessed by the right people. ? Key Components in POS Systems ✅ Data ...
    • Input Controls: Streamlining Data Entry

      Overview Input Controls are the tools that allow users to enter information into iVendNext POS — like item codes, quantities, or customer details. These can include: Text boxes for typing product codes Numeric keypads for entering cash amounts ...
    • Customizing and Managing Data

      Overview This article will guide you through the key features and best practices for customizing and managing data in iVendNext. 1. Introduction to Data Customization and Management in iVendNext iVendNext offers a range of tools that allow you to ...
    • Customizing Button Panel Controls for Efficient POS Operations

      Overview This article will walk you through creating, customizing, and optimizing button panels to match your store's unique workflow. 1. Understanding Button Panel Controls Button Panel Controls are customizable grids of buttons that: Execute POS ...
    • Item Groups: Organizing Your Products

      Overview This article will help you understand, create, and manage item groups in iVendNext. What are Item Groups? Definition Item Groups are categories used to classify items based on shared characteristics, such as type, usage, or function. For ...