DHTMLX Docs & Samples Explorer

dhtmlxGrid API Methods

Configuration

  • attachEvent adds any user-defined handler to available events
  • attachFooter attaches an additional line to the footer
  • attachHeader attaches an additional line to the header
  • attachToObject attaches grid to some object in DOM
  • destructor destructor, removes grid and cleans used memory
  • detachEvent removes an event-handler
  • detachFooter removes the footer line from grid (opposite to attachFooter)
  • detachHeader removes the header line from grid (opposite to attachHeader)
  • enableAutoHeight enables an autoheight of grid
  • enableAutoWidth changes grid's container size on the fly to fit total width of grid columns
  • enableCellIds enables/disables unique id for cells (id will be automatically created using the following template: “c_[RowId]_[colIndex]”)
  • enableHeaderImages specifies if values passed to Header are images file names
  • init initializes grid
  • setAwaitedRowHeight sets a height which will be used in the smart rendering mode for row calculation, the function needs to be used if you use a custom skin for grid which changes default row height
  • setCSVDelimiter change csv delimiter
  • setColAlign sets an align of values in columns
  • setColSorting sets column sort types (avaialble: str, int, date, na or function object for custom sorting)
  • setColTypes sets column types
  • setColVAlign sets a vertical align of columns
  • setColWidth sets the width of specified column in pixels (soen't works with procent based grid)
  • setDelimiter sets delimiter character used in list values (default is ”,”)
  • setHeader sets header label and default params for new headers
  • setIconPath sets path to external images used in grid ( tree and img column types )
  • setImagePath sets path to grid internal images (sort direction, any images used in editors, checkbox, radiobutton)
  • setInitWidths sets width of columns in pixels
  • setInitWidthsP sets width of columns in percents
  • setNoHeader creates grid with no header. Called before initialization, but after setHeader. setHeader have to be called in any way as it defines number of columns
  • setSkin sets one of predefined css styles (xp, mt, gray, light, clear, modern)
  • setStyle modifies default style of grid and its elements. Call before or after Init
  • uid returns unique ID

Data Loading

  • changePage changes current page in grid
  • changePageRelative changes current page in grid
  • clearAll deletes all rows in grid
  • clearAndLoad clears an existing grid state and load new XML
  • enableCSVAutoID enables mode, where ID for rows loaded from CSV autogenerated
  • enableCSVHeader enables recognizing the first row in CSV as header
  • enableDistributedParsing enables/disables the distributed parsing (rows are parsed portion by portion with some timeout)
  • enablePaging enables the smart paging mode
  • enableSmartRendering enables the smart rendering mode
  • getRowAttribute gets row attribute
  • getStateOfView returns details about current grid state
  • getUserData gets user Data
  • load loads data from an external file ( xml, json, jsarray, csv )
  • loadCSVFile loads grid from CSV file
  • loadCSVString loads grid from CSV string
  • parse loads data from local datasource ( xml string, csv string, xml island, xml object, json objecs , javascript array )
  • preventIECaching prevents caching in IE by adding random values to URL string
  • setAwaitedRowHeight sets a height which will be used in the smart rendering mode for row calculation, the function needs to be used if you use a custom skin for grid which changes default row height
  • setCSVDelimiter change csv delimiter
  • setDelimiter sets delimiter character used in list values (default is ”,”)
  • setPagingSkin allows to set custom paging skin
  • setPagingTemplates allows to set paging templates for default skin
  • setPagingWTMode configures paging with toolbar mode ( must be called BEFORE enablePaging)
  • setRowAttribute sets new attribute to the row
  • setUserData sets user data to row
  • startFastOperations starts fast operation mode, in such mode events are not generated, some time consuming actions applied only once, which allow to increase performance
  • stopFastOperations turns off fast operation mode, need to be executed to normalize view.
  • updateFromXML refreshes grid from XML ( doesnt work for buffering, tree grid or rows in smart rendering mode )

Rows manipulations

Columns manipulations

Cells manipulation

  • cellById gets a dhtmlXGridCellObject object (if no arguments then gets dhtmlXGridCellObject object of currently selected cell)
  • cellByIndex gets a dhtmlXGridCellObject object
  • cells gets a dhtmlXGridCellObject object (if no arguments then gets dhtmlXGridCellObject object of currently selected cell)
  • cells2 gets a dhtmlXGridCellObject object
  • checkAll checks all checkboxes in grid
  • clearChangedState clears wasChanged state for all cells in grid
  • editCell creates an Editor object and switch a cell to the edit mode if allowed
  • editStop retuns a value from editor(if presents) to cell and closes editor
  • enableCellIds enables/disables unique id for cells (id will be automatically created using the following template: “c_[RowId]_[colIndex]”)
  • enableColSpan enables/disables the colspan support
  • enableEditEvents enables/disables events which fires excell editing, mutual exclusive with enableLightMouseNavigation
  • enableMarkedCells sets the marked cells support to enabled or disabled state
  • enableMathEditing enables/disables editing of math cells
  • enableRowspan enables rowspan in grid
  • enableTooltips enables/disables tooltips for specified columns
  • forEachCell executes a code for each cell in a row
  • getCombo gets a Combo object of specified column. Uses it to change a select box value for a cell before opening editor
  • getCustomCombo gets combobox specific for the cell in question
  • getMarked gets marked cells
  • getSelectedCellIndex gets the index of selected cell
  • mark sets selection or removes selection from specified cell
  • selectCell sets selection to specified row-cell
  • setCellExcellType sets excell type for cell in question
  • setCellTextStyle sets a style to cell
  • setColspan dynamically sets colspan in row starting from specified column index
  • setColumnExcellType sets excell type for all cells in specified column
  • setDateFormat sets mask for date formatting in cell
  • setEditable manages editibility of the grid
  • setMathRound enables/disable rounding while math calculations
  • setNumberFormat sets mask for formatting numeric data ( works for [ed/ro]n excell only or oher cell types with suport for this method)
  • setRowExcellType sets excell type for all cells in specified row
  • setRowspan sets rowspan with specified length starting from specified cell
  • uncheckAll unchecks all checkboxes in grid
  • unmarkAll removes selection from all marked cell

Selection

Sorting

Filtering

  • collectValues gets all possible values in column
  • filterBy filters grid by mask
  • filterByAll forces grid filtering by registered inputs ( created by # starting shortcuts, or by makeFilter function )
  • findCell finds a cell in grid by value
  • getFilterElement gets input object of filter linked to column in question
  • makeFilter creates a filter from any input element (text filter), select (dropdown) or DIV (combobox based on dhtmlxCombo)
  • makeSearch creates a search box (set selection to the row with found value) from any input
  • refreshFilters refreshes filtering ( can be used if data in grid changed and filters need to be updated )

Grouping

Drag-n-drop

  • enableDragAndDrop enables/disables drag-and-drop
  • enableDragOrder switches to the mode when dragged item, dropped in target location in the same order as they were in the source grid
  • enableMercyDrag enables dragging without removing (copy instead of move)
  • gridToGrid redefines this method in your code to define how grid row values should be used in another grid
  • gridToTreeElement redefines this method in your code to define how grid row values should be used in tree (using input parameters you can change id of new tree node, set label, set userdata blocks etc.).
  • rowToDragElement redefines this method in your code to define how grid row values should be displaied while draging
  • setDragBehavior sets Drag-And-Drop behavior (child - drop as chils, sibling - drop as sibling
  • setDragText defines text (single and plural forms) for extended visual appearence of drag-n-drop
  • treeToGridElement redefines this method in your code to define how tree node values should be used in grid (using input parameters you can change id of new row, values for cells, userdata blocks etc.).

Clipboard operations

Cookies operations

Saving data

  • enableCSVAutoID enables mode, where ID for rows loaded from CSV autogenerated
  • enableCSVHeader enables recognizing the first row in CSV as header
  • enableMathSerialization enables/disables serialization of math formulas
  • save - saves row data in DB
  • serialize gets actual xml of grid. The depth of serialization can be set with setSerializationLevel method
  • serializeToCSV serializes to CSV string
  • setCSVDelimiter change csv delimiter
  • setFieldName allows to define input name which will be used for data sending, name may contain next auto-replaced elements - GRID_ID - ID of grids container, ROW_ID - ID of row, ROW_INDEX - index of row, COLUMN_ID - id of column, COLUMN_INDEX - index of column
  • setSerializableColumns configures which column must be serialized (if you do not use this method, then all columns will be serialized)
  • setSerializationLevel configures XML serialization
  • submitAddedRows includes additional data with info about which rows was added and which deleted, enabled by default
  • submitOnlyChanged includes only changed rows in form submit
  • submitOnlyRowID includes only row's IDS in form submit
  • submitOnlySelected includes only selected rows in form submit
  • submitSerialization includes serialized grid as part of form submit

Other extensions

Cell methods

  • getValue - gets the value of the specified cell
  • setValue - sets the value for the specified cell
  • isDisabled - indicates whether the specified cell is disabled
  • setDisabled - disables/enabled the specified cell
  • isChecked - indicates whether a checkbox or radio is checked
  • getAttribute - checks whether the specified cell has a certain attribute
  • getBgColor - determines the background color of the cell
  • getHorAlign - retrieves the horizontal alignment set in the cell
  • getMathValue - gets the math formula specified for the cell if any
  • getTextColor - determines the text color of the cell
  • getTitle - gets the value of the specified cell as it's displayed in the grid
  • getWidth - gets the width of the cell in pixels
  • setAttribute - sets a custom attribute (flag) for the specified cell
  • setBgColor - sets the background color for the cell
  • setHorAlign - sets the horizontal alignment in the cell
  • setTextColor - sets the text color for the cell