Docs
ServoyCloudSupportSamplesOpen SourceCommunity
  • Home
  • GUIDES
    • Platform Overview
    • Get Servoy
    • Get Started
      • Chapter 0
      • Chapter 1
      • Chapter 2
      • Chapter 3
      • Chapter 4
      • Chapter 5
    • Get Help
      • SuLA Instructions
      • SuLA Terms
    • Develop
      • Application Design
        • Forms
          • Layout Management
            • Simple Layout
            • Fully Responsive
              • Bootstrap 12-Grid
              • Flexbox
              • Custom Div
              • Collapsible Container
              • Simple Collapsible
              • Center Container
              • Inline Group Container
            • Abstract Form
          • Form Containers
            • Form Container
            • Tab Panel
            • Split Pane
            • Collapse
            • Accordion Panel
            • Form Component
            • List Form Component
          • Form Inheritance
          • Form Components
        • UI Components
          • Buttons and Text
            • Badge
            • Button
            • Data Label
            • Dropdown
            • Image
            • Label
          • Grids
            • Data Grid
            • Power Grid
            • Table
          • Input Controls
            • Calendar
            • Calendar Inline
            • Checkbox
            • Choice Group
            • Combobox
            • Group Buttons
            • Html Area
            • Input Group
            • Rating
            • Slider
            • Switch
            • Spinner
            • TextArea
            • Textbox
            • TextBoxGroup
            • Type Ahead
            • select2tokenizer
          • Media
            • Carousel
            • Embedded YouTube
            • File upload
            • Image label
            • Lightbox Gallery
            • MultiFile Upload
            • PDF JS Viewer
            • PDF Viewer
          • Mobile
            • Native Data List
            • Native Select
          • Navigation
            • Breadcrumbs
            • Navbar
            • sidenav
          • Visualization
            • DBTreeview
            • Progress Bar
            • Treeview
            • ChartJS
              • Data Labels Plugin
              • Funnel Chart
              • OutLabels Plugin
              • TreeMap
          • Specialized Components
            • Smart Document Editor
            • Servoy PDF Viewer
            • Fullcalendar Component
              • Fullcalendar
              • Fullcalendar Events
              • Migrating calendar from Smart and Web client to NG client
            • Fullcalendar Component 2
            • Canvas
            • Google Charts
            • Google Maps
            • svySignature
            • svywebcam
        • Styling and Themes
          • Default Theme Properties
          • CSS / LESS
          • Component Variants
          • Font Icons
        • Data Modeling
          • Databases
            • Tables
              • Columns
              • Calculations
              • Aggregations
              • Methods
              • Events / Triggers
              • Table security
            • Views
            • Procedures
          • Relations
          • Value Lists
          • Menus
          • In-Memory Databases
          • View Datasource
        • Modular Design
      • Programming Guide
        • Scripting the UI
          • Scripting Forms
          • Interacting with Components
          • Navigation
          • Windows, Dialogs and Popups
          • Events Manager
        • Working with Data
          • Concepts
          • Loading
          • Sorting
          • Iterating
          • Searching
            • Find mode
            • Query Builder
            • SQL String
          • Filtering
          • Editing
          • Validation
        • Automation and Scheduling
          • Batch Processor
          • Headless API
          • Scheduler API
        • Creating REST APIs
        • Consuming Webservices
        • Working with Files
          • File Plugin Basics
          • Images
          • Excel
          • PDF
          • JSON
        • Browser Utilities
          • Notifications
            • Web Notifications (Toastr)
            • Web Notifications (Native)
            • Block UI
          • Session Management
          • Keyboard Utilities
          • NG Utils
        • Sending and Receiving Email
        • Servoy Jasper Reports
          • Input Type
          • Display Mode
          • Output format
          • Jaspe Reports Viewer
        • Extensions
          • Modules
            • svyPhonegap
              • First Use Guide
              • Barcode Scanner
              • Browser
              • Camera
              • File
              • Fingerprint
              • Location
              • Network Interface
              • Phonegap
              • Printer
              • Push Notifications
            • svyAPI
              • Getting Started
            • svyLookup
              • Custom Templates
              • API Documentation
              • svyLookup v1
                • API Documentation v1.0.0
                • Base Form svyLookupTable v1.0.0
                • Base Form AbstractLookup v1.0.0
            • svyNavigation
              • API Documentation
                • API svyNavigation
                • API svyNavigationHistory
                • API svyNavigationUX
            • svyPopupFilter
              • Simple Filter Pickers
              • Custom Templates
              • API Documentation
                • API svyToolbarFilter
                • API svyPopupFilter
              • API Documentation v1
                • API svyToolbarFilter v1
                • API svyPopupFilter v1
            • svySearch
            • svySecurity
              • Overview
              • Token-based Auth and SSO (NEW!)
              • API Documentation
              • Getting Started
              • Tenant replication
              • Security Management Console
                • Classic Security Management Console
              • svySecurityUX
              • svyProperties
              • API Doc svyProperties
            • svyUtils
              • Log Manager
              • Log Manager Appenders
              • Smart Doc Editor Utils
              • Custom Dialogs
              • Excel Utils
                • Full API Reference
              • Crypto Utils
      • Security
        • Authentication
        • Permissions
          • UI Permissions
          • Data Permissions
          • Runtime Permissions
        • Audit Logging
        • OAuth
        • JWT
      • Multi-Language Support
      • Mobile Development
        • Getting Started
        • Mobile Design
        • Native Mobile Integrations
        • Building a Native Binary for the App Store
      • Native Desktop Development
        • NGDesktop UI plugin
        • NGDesktop Utils
        • NGDesktop File Plugin
    • Deploy
      • WAR Deployment
      • Docker Deployment
      • Server Configuration
        • Server Settings
        • Server Plugins
        • Database Servers
          • Locks
          • Transactions
          • Oracle
          • SQLServer
        • Client Sessions
        • Batch Processors
        • License Management
        • Monitoring
          • Server Log
          • Browser Console Log
          • Websocket Log
          • Query Performance
          • Client Performance
          • Client Event Tracing
          • Monitoring Servoy with JMX
      • NGClient deployment
      • Troubleshooting
      • Other Topics
        • Security: Cross-site Scripting
        • Running in an iFrame
    • Extend
    • Contribute
  • Reference
    • Servoy Core
      • Object Model
        • Database Server
          • Table
            • Column
            • Calculation
            • Method
            • Aggregation
          • View
          • Procedure
        • Solution
          • Form
          • Form Component
          • Relation
          • Relation Item
          • Table Node
          • Value List
          • Menu
          • Menu item
          • In-Memory Data Source
          • View Foundset Data Source
          • Variable
          • Column Info
          • Media
          • Layout Container
          • Method
        • i18n Message Key
      • Developer API
        • Globals
        • Forms
          • RuntimeForm
            • controller
            • containers
              • RuntimeContainer
            • elements
              • Component
              • RuntimeAccordionPanel
              • RuntimeBean
              • RuntimeButton
              • RuntimeCalendar
              • RuntimeCheck
              • RuntimeCombobox
              • RuntimeComponent
              • RuntimeDataButton
              • RuntimeDataLabel
              • RuntimeGroup
              • RuntimeHtmlArea
              • RuntimeImageMedia
              • RuntimeInsetList
              • RuntimeLabel
              • RuntimeListBox
              • RuntimePassword
              • RuntimePortal
              • RuntimeRadio
              • RuntimeChecks
              • RuntimeRadios
              • RuntimeRectangle
              • RuntimeRtfArea
              • RuntimeSpinner
              • RuntimeSplitPane
              • RuntimeTabPanel
              • RuntimeTextArea
              • RuntimeTextField
              • RuntimeWebComponent
        • JS Lib
          • Array
          • BigInt
          • Boolean
          • Date
          • Function
          • IterableValue
          • Iterator
          • JSON
          • Map
          • Set
          • Math
          • Namespace
          • Number
          • Object
          • Promise
          • QName
          • RegExp
          • Special Operators
          • Statements
          • String
          • XML
          • XMLList
        • Application
          • APPLICATION_TYPES
          • CLIENTDESIGN
          • DRAGNDROP
          • ELEMENT_TYPES
          • LOGGINGLEVEL
          • NGCONSTANTS
          • UICONSTANTS
          • CSSPosition
          • JSDimension
          • JSDNDEvent
          • JSEvent
          • JSLogger
          • JSLogBuilder
          • JSPoint
          • JSUpload
          • JSWindow
          • JSBounds
          • Renderable
          • UUID
        • SolutionModel
          • ALIGNMENT
          • ANCHOR
          • BEVELTYPE
          • CURSOR
          • DEFAULTS
          • FONTSTYLE
          • MEDIAOPTION
          • PAGEORIENTATION
          • PRINTSLIDING
          • SCROLLBAR
          • TITLEJUSTIFICATION
          • TITLEPOSITION
          • UNITS
          • JSBean
          • JSButton
          • JSCalculation
          • JSComponent
          • JSDataSourceNode
          • JSField
          • JSForm
          • JSLabel
          • JSMedia
          • JSMethod
          • JSPart
          • JSPortal
          • JSRelation
          • JSRelationItem
          • JSStyle
          • JSTab
          • JSTabPanel
          • JSValueList
          • JSVariable
          • JSTitle
          • JSChecks
          • JSCombobox
          • JSHeader
          • JSInsetList
          • JSList
          • JSPassword
          • JSRadios
          • JSText
          • JSTextArea
          • JSWebComponent
          • JSLayoutContainer
        • Database Manager
          • QUERY_COLUMN_TYPES
          • SQL_ACTION_TYPES
          • JSColumn
          • JSDataSet
          • JSBaseRecord
          • JSBaseSqlRecord
          • JSBaseFoundset
          • JSBaseSQLFoundset
          • JSFoundSet
          • JSFoundSetUpdater
          • JSRecord
          • JSRecordMarker
          • JSRecordMarkers
          • JSTable
          • JSTableFilter
          • MenuFoundSet
          • MenuItemRecord
          • QBAggregate
          • QBAggregates
          • QBCase
          • QBCaseWhen
          • QBColumn
          • QBColumns
          • QBCondition
          • QBFunction
          • QBFunctions
          • QBGroupBy
          • QBJoin
          • QBJoins
          • QBLogicalCondition
          • QBParameter
          • QBParameters
          • QBPart
          • QBResult
          • QBSearchedCaseExpression
          • QBSelect
          • QBSort
          • QBSorts
          • QBTableClause
          • QBWhereCondition
          • ViewFoundSet
          • ViewRecord
        • Events Manager
          • EVENTS_AGGREGATION_TYPES
          • EventType
        • Menus
          • JSMenu
          • JSMenuItem
        • JSMenuDatasource
        • Utils
        • Client Utils
          • JSBlobLoaderBuilder
        • History
        • Security
        • i18n
        • ServoyException
          • DataException
        • JSUnit
        • Datasources
          • DBDataSource
          • DBDataSourceServer
          • JSConnectionDefinition
          • JSDataSource
          • MemDataSource
          • MenuDataSource
          • SPDataSource
          • SPDataSourceServer
          • ViewDataSource
        • JSViewDatasource
        • servoyDeveloper
        • enum
    • Extensions
      • UI Components
        • Buttons and Text
          • Badge
          • Button
          • Data Label
          • Drop Down
          • Image
          • Label
        • Form Containers
          • Accordion Panel
          • Collapse
          • Form Container
          • Form Component Container
          • List Form Component
          • Default Loading Indicator
          • Error Bean
          • Portal
          • Responsive Container
          • Servoy Default Navigator
          • Slider
          • Split Pane
          • TabPanel
        • Grids
          • Data Grid
          • Power Grid
          • Table
        • Input Controls
          • Calendar
          • Calendar Inline
          • Checkbox
          • Choice Group
          • Combobox
          • Floatinglabel Calendar
          • Floatinglabel Combobox
          • Floatinglabel Textarea
          • Floatinglabel Textbox
          • Floatinglabel Type Ahead
          • Group Buttons
          • Html Area
          • Input Group
          • Rating
          • Select2tokenizer
          • Slider
          • Spinner
          • Switch
          • TextArea
          • TextBox
          • TextBox Group
          • Type Ahead
        • Media
          • Carousel
          • Embedded YouTube
          • File upload
          • Image label
          • Lightbox Gallery
          • MultiFile Upload
          • PDF JS Viewer
          • PDF Viewer
        • Mobile
          • Native Data List
          • Native Select
        • Navigation
          • Breadcrumbs
          • Navbar
          • sidenav
        • SmartDocEditor
          • Smart Document Editor
        • Visualization
          • Canvas
          • Chart
          • Custom List
          • DBTreeview
          • Foundset List
          • Fullcalendar
          • Gauge
          • Google Maps
          • Kanban
          • Progress Bar
          • Treeview
      • Server Plugins
        • amortization
          • AmortizationCalculation
          • Polynomial
        • clientmanager
          • Broadcaster
          • JSClientInformation (cm)
        • excelxport
        • file
          • JSFile
          • JSProgressMonitor
        • headlessclient
          • JSClient
        • http
          • HTTP_STATUS
          • Cookie
          • DeleteRequest
          • GetRequest
          • HeadRequest
          • HttpClient
          • HttpClientConfig
          • OptionsRequest
          • PostRequest
          • PutRequest
          • Response
          • TraceRequest
          • PatchRequest
          • JSFileUpload
        • images
          • JSImage
        • jwt
          • Algorithm
          • Builder
          • JWTClaims
        • mail
          • Attachment
          • MailMessage
        • maintenance
          • JSClientInformation
          • JSColumnObject
          • JSServer
          • JSTableObject
        • mobileservice
          • OfflineDataDescription
        • oauth
          • ClientAuthentication
          • CustomApiBuilder
          • OAuthProviders
          • OAuthRequest
          • OAuthResponse
          • OAuthResponseBinary
          • OAuthResponseJSON
          • OAuthResponseText
          • OAuthService
          • OAuthServiceBuilder
          • OAuthTokenExtractors
          • RequestType
        • pdf_output
        • rawSQL
        • RestWs plugin
        • rest_ws
          • WsContents
          • WsCookie
          • WsRequest
          • WsResponse
        • scheduler
        • serialize
        • textxport
          • DataProviderExport
          • TabExporter
        • udp
          • JSPacket
        • XmlReader
          • XmlNode
      • Browser Plugins
        • Block UI
        • Block UI (ref)
        • Dialogs Plugin
        • Idle
        • Idle (ref)
        • Key Listener
        • Key Listener (ref)
        • NGDesktop File
        • NGDesktop File (ref)
        • NGDesktop UI (ref)
        • NGDesktop Utils (ref)
        • NG Utils (ref)
        • Office Javascript API for Servoy
        • Phonegap
        • Web Notifications (Native)
        • Web Notifications (Toastr)
        • Window Plugin
        • Font Awesome
      • Modules
        • Smart Doc Editor Utils
        • svyAPI
          • Getting Started
        • svyLookup
          • Custom Templates
          • API Documentation
          • svyLookup v1
            • API Documentation v1.0.0
            • Base Form svyLookupTable v1.0.0
            • Base Form AbstractLookup v1.0.0
        • svyLookupExample
        • svyNavigation
          • API Documentation
            • API svyNavigation
            • API svyNavigationHistory
            • API svyNavigationUX
        • svyNavigationUX
        • svyNavigationUXSample
        • svyPopupFilter
          • Simple Filter Pickers
          • Custom Templates
          • API Documentation
            • API svyToolbarFilter
            • API svyPopupFilter
          • API Documentation v1
            • API svyToolbarFilter v1
            • API svyPopupFilter v1
        • svyProperties
        • svySearch
        • svySecurity
          • Overview
          • Token-based Auth and SSO (NEW!)
          • API Documentation
          • Getting Started
          • Tenant replication
          • Security Management Console
            • Classic Security Management Console
          • svySecurityUX
          • svyProperties
          • API Doc svyProperties
        • svySecurityConsole
        • svySecurityUX
        • svyUtils
          • Log Manager
          • Log Manager Appenders
          • Smart Doc Editor Utils
          • Custom Dialogs
          • Excel Utils
          • Full API Reference
          • Crypto Utils
        • svyUtils$Excel
        • svyUtils$NGClient
        • svyUtils$customDialogs
        • svyUtils$logManagerAppenders
        • svyUtils$tableGrid
      • Layout
        • Boostrap 12grid layout
          • Collapsible Container
          • Simple Collapsible
          • Center Container
          • Inline Group Container
          • Flexbox Layout
      • Solutions
        • Sample Application
          • Tutorial Part 1
          • Tutorial Part 2
      • Packages
        • UI Component Packages
          • Advanced Renderers
          • Bootstrap Components
          • Bootstrap Extra Components
          • Canvas
          • Chart JS
          • Fullcalendar Component
          • googlemaps
          • kanban
          • Servoy Core
          • Servoy Extra Components
          • Servoy NG-Grids
          • Servoy PDF Viewer
          • smartDocumentEditor
        • Browser Plugin Packages
          • Block UI
          • Core NG only Services
          • Key Listener
          • NGDesktop File
          • NGDesktop UI
          • NGDesktop Utils
          • Web Notifications
          • Idle Web Service
    • Servoy Developer
      • Menu
        • File
        • Edit
        • Source
        • Refactor
        • Navigate
        • Search
        • Project
        • Actions
        • Run
        • Window
        • Help
      • Toolbar
      • Solution Explorer
        • Resources
          • Database Servers
            • Database Server
              • Procedures
              • Tables
              • Views
          • Security
          • i18n
        • All Solutions
          • Solution
          • Active Solution
            • Scopes
              • Scope
                • Variables
            • Forms
              • Working Set
              • Form
                • Controller
                • Variables
                • Elements
                • Relations
            • Form Components
              • Form Component
            • Relations
              • Relation
            • ValueLists
              • ValueList
            • Menus
              • Menu
                • MenuItem
            • Media
              • Folder
              • File
            • DataSources
              • In Memory DataSources
                • In Memory DataSource
              • View Foundsets DataSources
                • View Foundset DataSources
            • Servoy Packages
              • Package
            • Modules
              • Module
        • Solution Explorer Contextual List
      • Views
        • Command Console
        • Console
        • Problems
        • Tasks
        • Bookmarks
        • Search
        • Form Hierarchy
        • Help
        • JUnit
        • Outline
        • Profiler
        • Properties
        • Project Explorer
        • Call Hierarchy
      • Editors and Wizards
        • Property configurator for columns
        • Relation Editor
        • Text Format Editor
        • Date Format Editor
        • Number Format Editor
        • Database Synchronization Wizard
        • Security Editor
        • SQL Editor
        • i18n Editor
        • File Import Wizard
        • File Export Wizard
        • WAR Export Wizard
        • NGDesktop Export Wizard
        • Table Editor
        • Metadata Synchronization Wizard
        • Database Server Connection Editor
        • Text Property Editor
        • Valuelist Editor
        • Form Editor
          • Parts of the Form Editor
          • Designing a Form
          • Layout Tools
          • Using Containers
          • Creating and Using Forms
          • Using Servoy Beans
          • Using Shapes
          • Form Editor Subtabs
          • [Tips and Shortcuts][reference/servoy-developer/object-editors/form-editor-tips_and_shortcuts.md]
          • Editong a Responsive LayoutForm
          • CSS Positioning
        • Form Hierarchy
        • Component Properties Editor
        • Variable Editor
        • Method Selection Wizard
        • New Solution Wizard
        • Application Event Types Editor
        • New Form Wizard
        • Form Dataproviders Configurator
        • Servoy Resource Locator
        • Datasource Selection Wizard
        • Sorting Fields Wizard
        • Scripting Editor
          • Getting Started-Overview of Script Editor
          • Code Writing Features
          • Code Navigation
          • Code Rewriting Tools
          • Refactoring
          • Code Formatting
          • Script Editor Tips and Shortcuts
          • Unit Tests
        • Theme Editor
          • General Properties
          • Sidenav Properties
          • Navbar Properties
          • Tabs Properties
          • Windows Properties
          • Dialogs Properties
          • Tables Properties
          • Breadcrumb specific style Properties
          • Brand colors Properties
          • Validations Properties
          • Margins and Padding Properties
        • Editor Selection
        • Run Configurations
        • Debug Configurations
        • Externalize Strings Wizard
        • Font Chooser Wizard
        • Color Chooser Wizard
        • Project Properties Configurator
        • Move Wizard
        • External Tools Configurations
        • About Servoy Developer
        • Servoy Developer Installation Details
        • Eclipse Marketplace Wizard
        • Install Available Software Wizard
        • Cheat Sheet Selection Wizard
        • Servoy Developer Help Wizard
        • Switch to Editor Wizard
        • Find Actions Wizard
        • Customize Perspective Configurator
        • Quick Search Wizard
        • Search Wizard
        • Encoding Wizard
        • Task Wizard
        • Find - Replace Wizard
        • Properties Editor
        • New Project Wizard
        • New Method Wizard
        • New Menu Wizard
          • New MenuItem Wizard
        • Menu Editor
        • ServoyMenu Selection Wizard
        • JSMenu compatible component selector
        • Permissions Configuration Dialog
      • Project File Structure
        • Servoy Installation Directory
          • servoy.properties
        • Workspace Folder
          • Resources Directory
            • Database Information (.dbi) Files
          • Solution Folder
      • Package Manager
      • Preferences
      • Property Types for components / services
      • Debugger
        • Debug Explorer
        • Breakpoints
          • Breakpoint Properties
        • Variables
        • Expressions
        • Interactive Console
    • Application Server
    • Servoy Cloud
      • Cloud Control Center
        • Home
          • Setup Namespace
          • User profile
            • My Profile
            • Support
        • Download IDE
        • Application Overview
          • Applications
            • Pipelines
              • Jobs
                • Packages
                  • Commits
                  • Artifacts
                  • Configuration
                  • Quality reports
                  • Build markers
                • Job Configuration
                  • Build and Deploy or Build
                  • Mobile
                  • Desktop
            • Environments
              • Metrics
                • Users
                • Databases
                  • Metrics
                • System Health
                • Log Activity
                • App performance
                • Query performance
              • Cloud reporting
            • Security
              • Permissions
              • Tenants
            • Reports
            • Security Login Designer
              • Single Sign-On
                • Sign in with Google
                • Sign in with Microsoft
          • Code Repositories
        • Project Management
          • Tickets
          • Backlog
          • Active Sprints
        • User Management
          • Users
          • Roles
        • Administration
          • Security
            • ServoyCloud Roles
          • Credentials
          • Settings
        • Add-Ons
      • Database Backup
      • E2E Cypress Testing
        • Using Cypress
      • On-Premise Deployment
      • Privacy policy (ServoyAI)
      • FAQ
      • Migrate to Servoy Cloud
    • Extensions Developement
      • Component and Services
        • Component Development
        • Service Development
        • Tools and Dev Tips to use for Component/Service developement
        • Manifest (.mf file)
        • Specification (.spec file)
          • Property Types
            • Array property types
            • Custom object property types
            • Findmode property type
            • Foundset property type
            • Tags
        • Directives And Filters
          • Sablotabsequence
        • Console (serverside)
        • ServoyApi (serverside)
      • Serverside Plugins
        • Data Convertors and Validators
        • UI Convertors
  • Release notes
    • Release notes
      • 2025.03
      • 2024.03 (LTS)
      • 2023.03 (LTS)
      • 2025.03 (Servoy Cloud)
      • 2024.12
      • 2024.12 (Servoy Cloud)
      • 2024.09
      • 2024.09 (Servoy Cloud)
      • 2024.06
      • 2024.06 (Servoy Cloud)
      • 2024.03 (Servoy Cloud)
      • 2023.12
      • 2023.12 (Servoy Cloud)
      • 2023.09
      • 2023.09 (Servoy Cloud)
      • 2023.06
      • 2022.03 (LTS)
      • 2022.12 What's new
      • 2022.12
      • 2022.09 What's new
      • 2022.09
      • 2022.06 What's new
      • 2022.06
      • 2021.03.3 (LTS)
Powered by GitBook
On this page
  • Properties
  • arrowsUpDownMoveWhenEditing
  • checkboxSelection
  • columns
  • columnsAutoSizing
  • columnsAutoSizingOn
  • continuousColumnsAutoSizing
  • customMainMenu
  • editNextCellOnEnter
  • enableColumnMove
  • enableColumnResize
  • enableSorting
  • enabled
  • gridOptions
  • groupCheckbox
  • groupUseEntireRow
  • iconConfig
  • localeText
  • mainMenuItemsConfig
  • myFoundset
  • onDragGetImageFunc
  • onDragOverFunc
  • readOnly
  • responsiveHeight
  • rowHeight
  • rowStyleClassDataprovider
  • showColumnsMenuTab
  • showGroupCount
  • showLoadingIndicator
  • styleClass
  • tabSeq
  • toolPanelConfig
  • tooltipTextRefreshData
  • visible
  • Events
  • onCellClick(foundsetindex,columnindex,record,event,dataTarget)
  • onCellDoubleClick(foundsetindex,columnindex,record,event,dataTarget)
  • onCellRightClick(foundsetindex,columnindex,record,event,dataTarget)
  • onColumnDataChange(foundsetindex,columnindex,oldvalue,newvalue,event,record)
  • onColumnFormEditStarted(foundsetindex,columnindex,value)
  • onColumnStateChanged(columnState,event)
  • onCustomMainMenuAction(menuItemName,colId)
  • onDrop(sourceRows,targetRecord,event)
  • onElementDataChange()
  • onFooterClick(columnindex,event,dataTarget)
  • onReady()
  • onRowGroupOpened(groupcolumnindexes,groupkeys,isopened)
  • onSelectedRowsChanged(isgroupselection,groupcolumnid,groupkey,groupselection)
  • onSort(columnindexes,sorts)
  • API
  • addFunctionCall(alias,f)
  • autoSizeAllColumns()
  • editCellAt(foundsetindex,columnindex)
  • getCheckboxGroupSelection()
  • getColumn(index)
  • getColumnById(colId)
  • getColumnIndex(colId)
  • getColumnState()
  • getColumnsCount()
  • getExpandedGroups()
  • getGroupedSelection()
  • getViewColumnById(colId)
  • getViewColumns()
  • isToolPanelShowing()
  • moveColumn(id,index)
  • newColumn(dataprovider,index)
  • notifyDataChange()
  • refreshData()
  • removeAllColumns()
  • removeColumn(index)
  • requestFocus(columnindex)
  • restoreColumnState(columnState,onError,columns,filter,sort)
  • scrollToSelection()
  • setCheckboxGroupSelection(groups)
  • setExpandedGroups(groups)
  • setFilterModel(filterModel)
  • setFormEditorValue(value)
  • setGroupedSelection(selectedRecords)
  • setReadOnly(readonly,columnids)
  • showToolPanel(show)
  • sizeColumnsToFit()
  • stopCellEditing(cancel)
  • Types
  • column
  • columnsAutoSizingOn
  • functionCall
  • gridConfig
  • groupedColumn
  • hashedFoundset
  • iconConfig
  • mainMenuItemsConfig
  • toolPanelConfig
  • viewColumn

Was this helpful?

  1. Reference
  2. Extensions
  3. UI Components
  4. Grids

Data Grid

PreviousGridsNextPower Grid

Last updated 1 month ago

Was this helpful?

(part of package '') Extends designtime/SolutionModel: Extends runtime:

Data Grid is a table with advanced functionality that operates on JSFoundset data (so it can work directly with the database). It is designed to work with a large number of rows, potentially infinite, since data is loaded lazily into the table, even when grouped.

This is a reference page; many components have detailed usage guides .

Properties

arrowsUpDownMoveWhenEditing

Defines action on TEXTFIELD editor for up/down arrow keys Type:


checkboxSelection

When true the row has a checkbox for selecting/unselecting Type: Default Value: false


columns

List all columns to be used in table as dataprovider Type:


columnsAutoSizing

Auto sizing for columns. SIZE_COLUMNS_TO_FIT: make the currently visible columns fit the screen. AUTO_SIZE: the grid will work out the best width to fit the contents of the 'visible' cells in the column. NONE: no auto sizing action performed Type: Default Value: null


columnsAutoSizingOn


continuousColumnsAutoSizing


customMainMenu


editNextCellOnEnter


enableColumnMove


enableColumnResize


enableSorting


enabled


gridOptions


groupCheckbox


groupUseEntireRow


iconConfig


localeText


mainMenuItemsConfig


myFoundset


onDragGetImageFunc


onDragOverFunc


readOnly


responsiveHeight


rowHeight


rowStyleClassDataprovider


showColumnsMenuTab


showGroupCount


showLoadingIndicator


styleClass


tabSeq


toolPanelConfig


tooltipTextRefreshData


visible


Events

onCellClick(foundsetindex,columnindex,record,event,dataTarget)

Called when the mouse is clicked on a row/cell. The foundsetindex is always -1 when there are grouped rows. If a column is disabled (enabled = false), ensure that you only execute code for that column if columnindex corresponds to it.

@private

Parameters:


onCellDoubleClick(foundsetindex,columnindex,record,event,dataTarget)

Called when the mouse is double-clicked on a row/cell. The foundsetindex is always -1 when there are grouped rows. If a column is disabled (enabled = false), ensure that you only execute code for that column if columnindex corresponds to it.

@private

Parameters:


onCellRightClick(foundsetindex,columnindex,record,event,dataTarget)

Called when the right mouse button is clicked on a row/cell. The foundsetindex is always -1 when there are grouped rows. If a column is disabled (enabled = false), ensure that you only execute code for that column if columnindex corresponds to it.

@private

Parameters:


onColumnDataChange(foundsetindex,columnindex,oldvalue,newvalue,event,record)

Called when the columns data is changed

Parameters:


onColumnFormEditStarted(foundsetindex,columnindex,value)

Called when the column's form editor is started

Parameters:


onColumnStateChanged(columnState,event)

Called when the columns state is changed

Parameters:


onCustomMainMenuAction(menuItemName,colId)

Called when a custom main menu item is chosen.

Parameters:


onDrop(sourceRows,targetRecord,event)

Called when a row is dropped as a result of a drag-n-drop

Parameters:


onElementDataChange()


onFooterClick(columnindex,event,dataTarget)

Called when the mouse is clicked on a footer cell

Parameters:


onReady()

Called when the table is ready to be shown


onRowGroupOpened(groupcolumnindexes,groupkeys,isopened)

Called when group is opened/closed

Parameters:


onSelectedRowsChanged(isgroupselection,groupcolumnid,groupkey,groupselection)

Called when the selected rows have changed.

Parameters:


onSort(columnindexes,sorts)

Called when sort has changed

Parameters:


API

addFunctionCall(alias,f)

Add a Servoy solution function to the grid, that can be called from AGGRID using params.context.componentParent.executeFunctionCall

Example:

function onLoad(event) {
	var f = function(params) {		
	     var generalMenuItems = ['pinSubMenu'];		
	     var saveLayoutItem = {	          
	          name: 'Save Layout',	
	          action: function() {	        	 
	               params.context.componentParent.executeFunctionCall('saveLayout', 'myLayout');
	          }
	     };		
	     generalMenuItems.push(saveLayoutItem);		
	     return generalMenuItems;	
	}
	elements.datagrid_2.addFunctionCall('saveLayout', saveLayout);
	elements.datagrid_2.gridOptions = { "getMainMenuItems": application.generateBrowserFunction(String(f)) };
}

Parameters:


autoSizeAllColumns()

Auto-sizes all columns based on content.


editCellAt(foundsetindex,columnindex)

Start cell editing (only works when the table is not in grouping mode).

Parameters:


getCheckboxGroupSelection()

Returns the selected headers or groups in the table when the headerCheckbox or groupCheckbox property is used. The returned value is an array of objects, where each object represents a selected group or header. Each object includes a `colId` representing the column identifier and, for groups, a `groupkey` representing the group key. For headers, the `groupkey` property is not included.

Example:

// Example of returned data
[
    { colId: 'country', groupkey: 'USA' },   // Group selection
    { colId: 'region' }                      // Header selection
]

getColumn(index)

Gets the column at index. Index is 0 based.

Example:

    elements.myElement.getColumn()

Parameters:


getColumnById(colId)

Gets the column with id colId

Example:

    elements.myElement.getColumnById('myid')

Parameters:


getColumnIndex(colId)

Return the column index for the given column id. Can be used in combination with getColumnState to retrieve the column index for the column state with colId in the columnState object.

Example:

// get the state
var state = elements.table.getColumnState();
// parse the state of each column
var columnsState = JSON.parse(state).columnState;

for (var index = 0; index < columnsState.length; index++) {

  // skip column hidden by the user
  if (!columnsState[index].hide) {

   // get the column using the colId of the columnState
   var columnIndex = elements.table.getColumnIndex(columnsState[index].colId);
     if (columnIndex > -1) {
       var column = elements.table.getColumn(columnIndex);
       // do something with column               
     }
 }
}

@public

Parameters:


getColumnState()

Returns the current state of the columns (width, position, grouping state) as a json string that can be used to restore to this state using restoreColumnState


getColumnsCount()

Gets the number of columns

Example:

    elements.myElement.getColumnsCount()

getExpandedGroups()

Returns currently expanded groups as an object like: {expandedGroupName1:{}, expandedGroupName2:{expandedSubGroupName2_1:{}, expandedSubGroupName2_2:{}}}


getGroupedSelection()

Returns the selected rows when in grouping mode


getViewColumnById(colId)

Returns the view column corresponding to the given column ID.

Parameters:


getViewColumns()

Returns an array of view columns currently visible in the grid.


isToolPanelShowing()

Returns true if the ToolPanel is showing


moveColumn(id,index)

Move column

Parameters:


newColumn(dataprovider,index)

Adds new column at specified index. Index is 0 based.

Example:

    var column = elements.myElement.newColumn('dataproviderid')

Parameters:


notifyDataChange()

Notify the component about a data change. Makes the component aware of a data change that requires a refresh data.

Call this method when you are aware of a relevant data change in the foundset which may affect data grouping (e.g. group node created or removed). The component will alert the user of the data change and it will suggest to the user to perform a refresh.

Please note that it’s not necessary to notify the table component if the component is not visible; the component will always present the latest data when rendered again.

@public


refreshData()

Force a full refresh of the data.

WARNING ! be aware that calling this API results in bad user experience since all group nodes will be collapsed instantaneously.

@public


removeAllColumns()

Removes all columns.

Example:

    elements.myElement.removeAllColumns()

removeColumn(index)

Removes column from specified index. Index is 0 based.

Example:

    elements.myElement.removeColumn(0)

Parameters:


requestFocus(columnindex)

Request focus on the given column

Parameters:


restoreColumnState(columnState,onError,columns,filter,sort)

Restore columns state to a previously save one, using getColumnState.

If no argument is used, it restores the columns to designe time state. If the columns from columnState does not match with the columns of the component, no restore will be done.

The optional boolean arguments: columns, filter, sort can be used to specify what to restore: - the columns size/position/visibility (default true), - the filter state (default false), - the sort state (default false).

Parameters:


scrollToSelection()

Scroll to the selected row


setCheckboxGroupSelection(groups)

Sets the selected headers or groups in the table when the headerCheckbox or groupCheckbox property is used. The input should be an array of objects where each object represents a selected group or header. The objects should have a `colId` representing the column identifier, and optionally a `groupkey` representing the key of the group. For headers, the `groupkey` should not be included.

Example:

// Example of selecting groups
const selectedGroups = [
    { colId: 'country', groupkey: 'USA' },
    { colId: 'country', groupkey: 'Canada' }
];
elements.myTable.setCheckboxGroupSelection(selectedGroups);

Example:

// Example of selecting headers
const selectedHeaders = [
    { colId: 'country' },
    { colId: 'region' }
];
elements.myTable.setCheckboxGroupSelection(selectedHeaders);

Parameters:


setExpandedGroups(groups)

Sets expanded groups

Parameters:


setFilterModel(filterModel)

Set the filter model. This api maps to ag-grid's setFilterModel; for more details on the model's structure check this page: https://www.ag-grid.com/angular-data-grid/filter-api/ To clear the filter, use an empty object ({}) as filterModel;

NOTE: The name of the columns from the model are the id properties of the column.

Example:

	var filterModel = {
		"country": {
			"filterType":"text",
			"type":"contains",
			"filter":"Argentina"
		}
	};
	
	var filterModelWithCondition = {
		"freight": {
			"filterType":"number",
			"operator":"OR",
			"condition1": { 
				"filterType":"number",
				"type":"equals",
				"filter":66
			},
			"condition2": {
				"filterType":"number",
				"type":"equals",
				"filter":23
			}
		}
	};
	
	elements.groupingtable_1.setFilterModel(filterModelWithCondition);
	
	//clear filter
	//elements.groupingtable_1.setFilterModel({});

@public

Parameters:


setFormEditorValue(value)

Set the currently opened form editor value

Parameters:


setGroupedSelection(selectedRecords)

Set the selection in grouping mode 111. The table must be already in grouping mode, and the record already loaded (the group of the record expanded - see: setExpandedGroups)

Parameters:


setReadOnly(readonly,columnids)

Set the table read-only state. If no columnids is used, all columns read-only state is set, otherwise only for the columns specified.

Parameters:


showToolPanel(show)

Show or hide the ToolPanel

Parameters:


sizeColumnsToFit()

Adjusts the columns' widths to fit the available viewport, ensuring that all visible columns are resized to fill the table's width. This method dynamically resizes columns to ensure no empty space remains in the grid's horizontal viewport.

Example:

elements.myTable.sizeColumnsToFit();

stopCellEditing(cancel)

If a cell is editing, it stops the editing

Parameters:


Types

column

Type definition for a grid column. scripting type: CustomType<aggrid-groupingtable.column>

  • autoResize

    • Enables auto-resizing for the column.

    • Default Value: true

  • columnDef

    • Map where additional column properties of ag-grid can be set

  • dataprovider

    • Data provider identifier for the column.

  • dndSource

    • Allow dragging

    • Default Value: false

  • dndSourceDataprovider

    • Boolean dataprovider for allow/disallow dragging.

  • editForm

    • Form used as custom editor

  • editFormSize

    • Size configuration for the custom editor form.

    • Default Value: {"width":300,"height":200}

  • editType

    • Type of editing used for that column

  • enableResize

    • Allows resizing of the column.

    • Default Value: true

  • enableRowGroup

    • Allow the user to group or ungroup the column

    • Default Value: true

  • enableSort

    • Allows sorting on this column.

    • Default Value: true

  • enableToolPanel

    • If the column should be visible in the tool panel

    • Default Value: true

  • enabled

    • Flag indicating if the column is enabled.

    • Default Value: true

  • excluded

    • When true the column is excluded from the UI

    • Default Value: false

  • filterType

    • Filter type to be used for this column.

  • footerStyleClass

    • CSS class for the column footer.

  • footerText

    • Footer text to display in the column.

  • footerTextShowAs

    • Defines how the footer text is rendered (e.g., inline, tooltip).

  • format

    • Format pattern for the column's data.

  • headerCheckbox

    • When true the column has checkbox for selecting/unselecting all rows

    • Default Value: false

  • headerGroup

    • Header group, that this column will be part of

  • headerGroupStyleClass

    • CSS class for the header group.

  • headerIconStyleClass

    • (Font awesome) Styles for header icon

  • headerStyleClass

    • CSS class for the column header.

  • headerTitle

    • If the column has a database linked dataprovider, the default value of the headerTitle is the title text of the database column or if that is not set, the database column name.

  • headerTooltip

    • Tooltip text for the header.

  • id

    • Used to set the column id (colId) property in the serialized column state json string of getColumnState and onColumnStateChanged

  • isEditableDataprovider

    • Use a Servoy calculation as isEditableDataprovider to set edit state conditionally to the table cell

  • maxWidth

    • Maximum width in pixels.

  • minWidth

    • Minimum width in pixels.

  • rowGroupIndex

    • Set the rowGroupIndex to group on the column; the index defines the order of the group when there are multiple grouped columns

    • Default Value: -1

  • showAs

    • Defines an alternative display mode for the column.

  • stopEditingOnChange

    • When true, editing stops on change.

    • Default Value: false

  • styleClass

    • CSS class for the cell.

  • styleClassDataprovider

    • Use a Servoy calculation as styleClassDataprovider to set styleClass conditionally to the table cell

  • tooltip

    • Tooltip text for the cell.

  • valuelist

    • Value list used to map column values.

  • valuelistConfig

    • Configuration for the value list.

  • visible

    • Visibility state of the column.

    • Default Value: true

  • width

    • Column width in pixels.

    • Default Value: 0

columnsAutoSizingOn

Events that trigger auto-sizing of columns. scripting type: CustomType<aggrid-groupingtable.columnsAutoSizingOn>

  • columnResize

    • Apply 'columnsAutoSizing' when columns are resized

    • Default Value: true

  • columnRowGroupChange

    • Apply 'columnsAutoSizing' when row grouping is changed

    • Default Value: true

  • displayedColumnsChange

    • Apply 'columnsAutoSizing' when columns are added/removed

    • Default Value: true

  • gridReady

    • Apply 'columnsAutoSizing' when grid is ready to be shown

    • Default Value: true

  • gridSizeChange

    • Apply 'columnsAutoSizing' when grid size changes

    • Default Value: true

  • toolPanelVisibleChange

    • Apply 'columnsAutoSizing' when the toolpanel visibility is changed

    • Default Value: true

functionCall

Definition for a Servoy solution function call. scripting type: CustomType<aggrid-groupingtable.functionCall>

  • alias

    • Alias for the function call.

  • f

    • The function reference to execute.

gridConfig

Grid configuration options. scripting type: CustomType<aggrid-groupingtable.gridConfig>

  • enableColResize

    • Enables column resizing.

    • Default Value: true

  • enableSorting

    • Enables column sorting.

    • Default Value: true

  • groupUseEntireRow

    • When true, group rows span the entire row.

    • Default Value: true

groupedColumn

Type definition for a grouped column. scripting type: CustomType<aggrid-groupingtable.groupedColumn>

  • columnid

    • Original column identifier associated with this group.

  • dataprovider

    • Data provider for the grouped column.

  • format

    • Format pattern for the grouped column.

  • id

    • Unique identifier for the grouped column.

  • styleClassDataprovider

    • Calculation to conditionally set CSS classes for the group.

  • valuelist

    • Value list for mapping grouped column data.

hashedFoundset

Type definition for a hashed foundset. scripting type: CustomType<aggrid-groupingtable.hashedFoundset>

  • columns

    • Column configuration for the foundset.

  • foundset

    • The foundset object reference.

  • foundsetUUID

    • Unique identifier for the foundset.

  • uuid

    • Unique hash identifier.

iconConfig

Icon configuration for various grid features. scripting type: CustomType<aggrid-groupingtable.iconConfig>

  • iconCheckboxChecked

    • Icon for a checked checkbox.

  • iconCheckboxCheckedReadOnly

    • Icon for a read-only checked checkbox.

  • iconCheckboxIndeterminate

    • Icon for an indeterminate checkbox.

  • iconCheckboxIndeterminateReadOnly

    • Icon for a read-only indeterminate checkbox.

  • iconCheckboxUnchecked

    • Icon for an unchecked checkbox.

  • iconCheckboxUncheckedReadOnly

    • Icon for a read-only unchecked checkbox.

  • iconClipboardCopy

    • Icon for copying to the clipboard.

  • iconClipboardPaste

    • Icon for pasting from the clipboard.

  • iconColumnGroupClosed

    • Icon for a closed column group.

  • iconColumnGroupOpened

    • Icon for an open column group.

  • iconColumnMoveAdd

    • Icon for adding a column.

  • iconColumnMoveGroup

    • Icon for grouping a column.

  • iconColumnMoveHide

    • Icon for hiding a column.

  • iconColumnMoveLeft

    • Icon for moving a column to the left.

  • iconColumnMoveMove

    • Icon for moving a column.

  • iconColumnMovePin

    • Icon for pinning a column.

  • iconColumnMovePivot

    • Icon for pivoting a column.

  • iconColumnMoveRight

    • Icon for moving a column to the right.

  • iconColumnMoveValue

    • Icon for moving a column's value.

  • iconColumnSelectClosed

    • Icon for closed column selection.

  • iconColumnSelectOpen

    • Icon for open column selection.

  • iconColumns

    • Icon for the columns panel.

  • iconDropNotAllowed

    • Icon indicating drop is not allowed.

  • iconEditorChecked

    • Icon for a checked editor state.

  • iconEditorUnchecked

    • Icon for an unchecked editor state.

  • iconFilter

    • Icon for filtering.

  • iconGroupContracted

    • Icon indicating a contracted group.

  • iconGroupExpanded

    • Icon indicating an expanded group.

  • iconMenu

    • Icon for the menu.

  • iconMenuAddRowGroup

    • Icon for adding a row group via the menu.

  • iconMenuPin

    • Icon for pinning in the header menu.

  • iconMenuRemoveRowGroup

    • Icon for removing a row group via the menu.

  • iconMenuValue

    • Icon for displaying values in the header menu.

  • iconPivotPanel

    • Icon for the pivot panel.

  • iconRefreshData

    • Icon for refreshing data.

  • iconRowGroupPanel

    • Icon for the row group panel.

  • iconSortAscending

    • Icon for ascending sort.

  • iconSortDescending

    • Icon for descending sort.

  • iconSortUnSort

    • Icon for unsorted state.

  • iconValuePanel

    • Icon for the value panel.

mainMenuItemsConfig

Configuration options for main menu items. scripting type: CustomType<aggrid-groupingtable.mainMenuItemsConfig>

  • autoSizeAll

    • Option to auto-size all columns.

    • Default Value: false

  • autoSizeThis

    • Option to auto-size the current column.

    • Default Value: false

  • contractAll

    • Option to contract all groups.

    • Default Value: false

  • expandAll

    • Option to expand all groups.

    • Default Value: false

  • pinSubMenu

    • Configuration for the pin sub-menu.

    • Default Value: false

  • resetColumns

    • Option to reset columns to default.

    • Default Value: false

  • rowGroup

    • Option to group rows by this column.

    • Default Value: true

  • rowUnGroup

    • Option to ungroup rows.

    • Default Value: true

  • valueAggSubMenu

    • Configuration for the value aggregation sub-menu.

    • Default Value: false

toolPanelConfig

Configuration options for the ag‑grid tool panel. scripting type: CustomType<aggrid-groupingtable.toolPanelConfig>

  • suppressColumnExpandAll

    • Suppress the "expand all" option in the tool panel.

    • Default Value: false

  • suppressColumnFilter

    • Suppress the column filter in the tool panel.

    • Default Value: false

  • suppressColumnSelectAll

    • Suppress the "select all" option in the tool panel.

    • Default Value: false

  • suppressRowGroups

    • Suppress row groups in the tool panel.

    • Default Value: false

  • suppressSideButtons

    • Suppress side buttons in the tool panel.

    • Default Value: false

viewColumn

Type definition for a view column. scripting type: CustomType<aggrid-groupingtable.viewColumn>

  • colId

    • Unique identifier for the view column.

  • hide

    • When true, the column is hidden.

  • rowGroup

    • Indicates if the column is used for grouping.

  • rowGroupIndex

    • Grouping order index.

  • sort

    • Sorting order (e.g., asc, desc).

  • sortIndex

    • Index for multi-column sorting.

  • width

    • Width of the view column.


Apply 'columnsAutoSizing' for these events even if 'continuousColumnsAutoSizing' is false Type:

Apply 'columnsAutoSizing' whenever columns width are changed Type: Default Value: false

Menu items to append to the columns menu, beside the default aggrid menus. Type:

Determines whether the focus should move to the next cell when Enter is pressed. Type: Default Value: false

If moving of columns is enabled Type: Default Value: true

Allow the user to resize columns Type: Default Value: true

Enable column sorting by clickin on the column's header Type: Default Value: true

Flag indicating if the grid is enabled for user interaction. Type: Default Value: true

Map where additional grid properties of ag-grid can be set Type:

When true the group has checkbox for selecting/unselecting all child rows Type: Default Value: false

When true the group takes the entire row Type: Default Value: true

Custom icon configuration for grid features (e.g., sort, filter, group icons). Type:

Map where locales of ag-grid can be set Type:

Configuration for main menu items (customizes options like column pinning, sorting, etc.). Type:

The foundset where data are fetched from Type: Default Value: {"foundsetSelector":""}

Called when row(s) drag-n-drop is started, to get the drag image as an html code. Type:

Callback when dragging over a row - returns one of the strings: 'copy', 'move', 'none' depending on the allowed drag operation. Type:

Flag indicating if the grid is in read‑only mode, disabling editing. Type: Default Value: false

Table's height to be set in a responsive form. When responsiveHeight is set to 0, the table will use 100% height of the parent container. When responsiveHeight is set to -1, the table will auto-size it's height to the number of rows displayed inside the grid - in this case there is no vertical scrollbar and all rows are rendered Type: Default Value: 300

The height in pixels of the table's rows Type: Default Value: 25

Use dataSource calculation as rowStyleClassDataprovider to set styleClass conditionally to rows. The calculation should return the class name (or names) to be applied to the row Type:

If the column selection panel should be shown in the column menu Type: Default Value: false

When true the number of rows for groups is shown, beside the name Type: Default Value: false

When true, shows a loading indicator while data is being fetched or refreshed. Type: Default Value: true

CSS class for the cell. Type: Default Value: "ag-theme-alpine"

Tab sequence index used for keyboard navigation in the grid. Type:

Configuration object for the ag‑grid tool panel (e.g., which panels to show, button behavior). Type:

Tooltip text shown when hovering the refresh button Type: Default Value: "Refresh for latest data !"

Controls the visibility of the grid component. Type:

{} foundsetindex - The index of the clicked row in the foundset (or -1 for grouped rows).

{} columnindex - The index of the clicked column in the grid.

{} record - The record object corresponding to the clicked row. (Optional)

{} [event] - The event object associated with the click. (Optional)

{} [dataTarget] - Optional identifier indicating the target data context. (Optional)

{} foundsetindex - The index of the double-clicked row in the foundset (or -1 for grouped rows).

{} [columnindex] - The index of the double-clicked column in the grid. (Optional)

{} [record] - The record object corresponding to the double-clicked row. (Optional)

{} [event] - The event object associated with the double-click. (Optional)

{} [dataTarget] - Optional identifier indicating the target data context. (Optional)

{} foundsetindex - The index of the row where the right-click occurred (or -1 for grouped rows).

{} [columnindex] - The index of the right-clicked column in the grid. (Optional)

{} [record] - The record object corresponding to the right-clicked row. (Optional)

{} [event] - The event object associated with the right-click. (Optional)

{} [dataTarget] - Optional identifier indicating the target data context. (Optional)

{} foundsetindex The index of the row that changed (1-based).

{} [columnindex] The index of the column that changed (0-based).

{} [oldvalue] The previous value of the cell.

{} [newvalue] The new value of the cell.

{} [event] The event object associated with the data change.

{} [record] The record object representing the changed row.

Returns: {}

{} [foundsetindex] The row index where editing starts.

{} [columnindex] The column index where editing starts.

{} [value] The initial value of the cell being edited.

{} columnState The new serialized state of the columns (e.g., widths, order, visibility).

{} [event] The event object triggering the state change.

{} menuItemName The name of the custom menu item that was selected.

{} colId The column identifier associated with the menu action.

{} sourceRows An Array of JSRecord objects if dragged from a data grid, or plain objects if from a power grid

{} targetRecord The target record where the rows were dropped.

{} event The event object associated with the drop action.

{} [columnindex] The index of the footer cell that was clicked.

{} [event] The event object associated with the click.

{} [dataTarget] Optional identifier indicating the target data context of the click.

{} [groupcolumnindexes] An array of column indexes associated with the group.

{} [groupkeys] An array of keys representing the group hierarchy.

{} [isopened] True if the group is opened; false if closed.

{} [isgroupselection] Indicates if the selection change pertains to a group row.

{} [groupcolumnid] The ID of the column used for grouping, if applicable.

{} [groupkey] The key identifying the group whose selection has changed.

{} [groupselection] True if the entire group is selected; false if deselected.

{} [columnindexes] An array of column indexes that have been sorted.

{} [sorts] An array of sort orders (e.g., 'asc', 'desc') corresponding to the sorted columns.

{} alias Name used in params.context.componentParent.executeFunctionCall to call the function

{} f The Servoy solution function

{} foundsetindex Foundset row index of the editing cell (1-based)

{} columnindex Column index in the model of the editing cell (0-based)

Returns: The selected headers or groups. Each object has the following structure: - `colId` (String): The identifier of the column. - `groupkey` (String, optional): The key of the group (not included for headers).

{} index Index between 0 and columns length -1

Returns: The column object at the specified index.

{} colId Id of the column

Returns: The column object corresponding to the provided id.

{} colId The unique identifier of the column whose index is to be retrieved.

Returns: The 0-based index of the column corresponding to the given column id, or -1 if the column id is not found.

Returns: The current state of the columns as a JSON string for restoring the state.

Returns: The total number of columns in the specified element.

Returns: An object representing the currently expanded groups, where each key is a group name, and its value is an object detailing any expanded subgroups.

Returns: An array of JSRecord objects representing the selected rows in grouping mode.

{} colId - The unique identifier of the column.

Returns: The view column object corresponding to the specified column ID.

Returns: An array of view column objects representing the columns currently displayed.

Returns: `true` if the ToolPanel is showing otherwise `false`

{} id Column id

{} index New position (0-based)

{} dataprovider Dataprovider of the column

{} [index] Index between 0 and columns length

Returns: The newly created column object at the specified index with the given dataprovider.

Returns: True if all columns were successfully removed; otherwise, false.

{} index Index between 0 and columns length -1

Returns: True if the column was successfully removed, false otherwise.

{} columnindex Column index in the model of the editing cell (0-based)

{} [columnState] A JSON string representing the saved state of the columns, including width, position, visibility, filters, and sorting. If omitted, the columns will be restored to their design-time state.

{} [onError] A callback function to handle errors during the restore process, such as mismatched column configurations.

{} [columns] Specifies whether to restore the columns' size, position, and visibility. Defaults to true.

{} [filter] Specifies whether to restore the columns' filter state. Defaults to false.

{} [sort] Specifies whether to restore the columns' sort state. Defaults to false.

{} groups The selected headers or groups. Each object should have the following structure: - `colId` (String): The identifier of the column. - `groupkey` (String, optional): The key of the group (not included for headers).

{} groups An object like {expandedGroupName1:{}, expandedGroupName2:{expandedSubGroupName2_1:{}, expandedSubGroupName2_2:{}}}

{} filterModel The filter model object defining the filtering criteria for the grid. Each key represents a column's id, and its value specifies the filter configuration, including filter type, conditions, and operator. To clear all filters, pass an empty object ({} ).

{} value Form editor value

{} selectedRecords Form editor value

{} readonly Read-only state

{} [columnids] Array of column ids to make ready-only

{} show A flag indicating whether to show (true) or hide (false) the ToolPanel in the Servoy component.

{} [cancel] 'true' to cancel the editing (ie don't accept changes)

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Boolean
JSMenu
Boolean
Boolean
Boolean
Boolean
Json
Boolean
Boolean
JSFoundset
Boolean
Number
Number
Boolean
Boolean
Boolean
Number
Number
JSRecord
JSEvent
String
Number
Number
JSRecord
JSEvent
String
Number
Number
JSRecord
JSEvent
String
Number
Number
Object
Object
JSEvent
JSRecord
Boolean
Number
Number
Object
String
JSEvent
String
String
Array<Object>
JSRecord
JSEvent
Number
JSEvent
String
Array<Number>
Array<Object>
Boolean
Boolean
String
Object
Boolean
Array<Number>
Array<String>
String
Number
Number
Array<Object>
Number
String
String
Number
String
Number
Object
Array<JSRecord>
String
Boolean
String
Number
String
Number
Boolean
Number
Boolean
Number
String
Boolean
Boolean
Boolean
Array<Object>
Object
Object
Object
Array<JSRecord>
Boolean
Array<String>
Boolean
Boolean
boolean
json
boolean
dimension
boolean
boolean
boolean
boolean
boolean
boolean
string
string
boolean
string
int
int
int
string
boolean
boolean
int
boolean
boolean
boolean
boolean
boolean
boolean
string
boolean
boolean
boolean
string
string
foundset
string
boolean
boolean
boolean
boolean
boolean
boolean
boolean
boolean
boolean
boolean
boolean
boolean
boolean
boolean
string
boolean
boolean
int
string
int
int
Servoy NG-Grids
JSWebComponent
RuntimeWebComponent
here
String
Boolean
String
Array<CustomType<aggrid-groupingtable.column>>
CustomType<aggrid-groupingtable.columnsAutoSizingOn>
CustomType<aggrid-groupingtable.iconConfig>
CustomType<aggrid-groupingtable.mainMenuItemsConfig>
CustomType<aggrid-groupingtable.toolPanelConfig>
CustomType<aggrid-groupingtable.column>
CustomType<aggrid-groupingtable.column>
CustomType<aggrid-groupingtable.viewColumn>
Array<CustomType<aggrid-groupingtable.viewColumn>>
CustomType<aggrid-groupingtable.column>
groupedColumn[]
Enabled
Map
Clientfunction
Clientfunction
Dataprovider
Styleclass
Tabseq
Tagstring
Visible
Function
Function
dataprovider
dataprovider
form
modifiable
styleclass
tagstring
format
tagstring
styleclass
styleclass
styleclass
titlestring
tagstring
dataprovider
styleclass
dataprovider
dataprovider
valuelist
valuelistConfig
function
dataprovider
format
dataprovider
valuelist
foundsetRef
styleclass
styleclass
styleclass
styleclass
styleclass
styleclass
styleclass
styleclass
styleclass
styleclass
styleclass
styleclass
styleclass
styleclass
styleclass
styleclass
styleclass
styleclass
styleclass
styleclass
styleclass
styleclass
styleclass
styleclass
styleclass
styleclass
styleclass
styleclass
styleclass
styleclass
styleclass
styleclass
styleclass
styleclass
styleclass
styleclass
styleclass
styleclass
styleclass
styleclass