DHTMLX Docs & Samples Explorer

List of initialization properties

Common initialization

  • parent - string or object, id of container, where tree will be initialized, mandatory
  • image_path - string, path to image folder, which will be used for icons in tree
  • skin - string, skin used by grid
  • auto_height - {boolean} enable autoheight of grid(enableAutoHeight)
  • auto_width - {boolean} changes grid's container size on the fly to fit total width of grid columns(enableAutoWidth)
  • context_menu - {object} enable/disable context menu(enableContextMenu)
  • css - {string} set even/odd css styles(enableAlterCss)
  • hover - {string} enable/disable hovering row on mouse over(enableRowsHover)
  • editable - {boolean} manage editibility of the grid(setEditable)
  • multiline - {boolean} set multiline rows support to enabled or disabled state(enableMultiline)
  • multiselect - {boolean} set multiselect mode to enabled or disabled state(enableMultiselect)
  • smart - {boolean} enable smart rendering mode(enableSmartRendering)
  • without_header - {boolean} create grid with no header. (setNoHeader)
  • xml - {string}, url of data xml file

Drag and Drop

  • drag - {boolean} enable/disable drag-and-drop(enableDragAndDrop)
  • drag_order - {boolean} switch to mode when draged item, droped in target location in same order as they was in source grid(enableDragOrder)
  • drag_behavior - {string} set Drag-And-Drop behavior (child - drop as chils, sibling - drop as sibling(setDragBehavior)
  • drag_copy - {boolean} enable drag without removing (copy instead of move)(enableMercyDrag)

CSV

  • csv_id - {boolean} enable mode, where ID for rows loaded from CSV autogenerated(enableCSVAutoID)
  • csv_header - {boolean} enable recognizing first row in CSV as header(enableCSVHeader)
  • csv_cell - {string} change csv delimiter(setCSVDelimiter)

Cookies

Form integration

  • submit_changed - {boolean} include only changed rows in form submit(submitOnlyChanged)
  • submit_serialization - {boolean} include serialized grid as part of form submit(submitSerialization)
  • submit_selected - {boolean} include only selected rows in form submit(submitOnlySelected)
  • submit_id - {boolean} include only row's IDS in form submit(submitOnlyRowID)

Extensions

  • block_selection - {boolean} enables block selection mode in grid(enableBlockSelection)
  • cell_ids - {boolean} enable/disable unique id for cells (id will be automaticaly created using the following template: “c_[RowId]_[colIndex]”)(enableCellIds)
  • colspan - {boolean} enable/disable colspan support(enableColSpan)
  • column_move - {boolean} enable move column functionality(enableColumnMove)
  • date_format - {string} set mask for date formatting in cell(setDateFormat)
  • distributed - {boolean} enable/disable distributed parsing (rows paresed portion by portion with some timeout)(enableDistributedParsing)
  • header_images - {boolean} specify if values passed to Header are images file names(enableHeaderImages)
  • header_menu - {boolean} enable pop up menu which allows hidding/showing columns(enableHeaderMenu)
  • keymap - {boolean} enable/disable hot keys in grid(enableKeyboardSupport)
  • markers - {boolean} sets marked cells support to enabled or disabled state(enableMarkedCells)
  • math_editing - {boolean} enable/disable editing of math cells(enableMathEditing)
  • math_serialization - {boolean} enable/disable serialization of math formulas(enableMathSerialization)
  • mouse_navigation - {boolean} enable/disable light mouse navigation mode (row selection with mouse over, editing with single click), mutual exclusive with enableEditEvents(enableLightMouseNavigation)
  • rowspan - {boolean} enable rowspan in grid(enableRowspan)
  • stable_sorting - {boolean} enables stable sorting algorithm(enableStableSorting)
  • tabulation - {boolean} enables/disables mode when readonly cell is not available with tab(enableEditTabOnly)
  • undo - {boolean} enable Undo/Redo functionality in grid(enableUndoRedo)

Events

any event can be assigned by using property equal to event name

	grid = new dhtmlXGridObject({
		parent:"a_grid",
		onRowSelect:function(){
			alert("I'm clicked");	
		}
	});

Columns configuration

Columns of grid can be defined through “columns” collection

    new dhtmlXGridObject({
        columns:[
           { column object 1 },
           ...
           { column object N }
        ]
        ...
    });

Where column object can contain next properties.

  • label - column label
  • id - column id
  • width - width of column
  • align - h-align of data in the column
  • valign - v-align of data in the column
  • sort - sort type of column
  • type - column type
  • options - collection, which may contain default set of options for co|coro column types