News in versions: FastGrid 1.0, TreeGrid 17.0
FastGrid FastSheet ExamplesSamples DocumentationDoc Download Licensing Prices Buy Development
services
References References Contacts
TreeGrid Gantt chart SpreadSheet ExamplesSamples DocumentationDoc Download Licensing Prices Buy Contacts

2. Dragging and pasting columns

Dragging columns inside grid and between grids and copying & pasting columns via clipboard

Source: 02-Tree.js
Source: 02-Nodes.js
Source: 02-Items.js
  • Example description


    • Move column with children by dragging by left mouse button, copy column by dragging by shift+right mouse button, copy column with children by dragging by ctrl+right mouse button. Select more columns (by panel column panel button) and drag them together.
    • There are three column types (default columns), NODE, ITEM and SUBITEM. The NODE can contain only ITEM. The ITEM can contain ITEM and SUBITEM. The SUBITEM can contain only SUBITEM.
    • New child in NODE is ITEM. New child in ITEM is SUBITEM. New child in SUBITEM is SUBITEM.
    • The Tree and Nodes grids can contain all columns (NODE, ITEM, SUBITEM), root columns are NODE. The Items grid can contain ITEM and SUBITEM columns, root columns are ITEM. The Subitems grid does not accept new columns.
    • Columns dragged from Tree, Nodes and Items grids are moved (or copied if dragged by right or middle mouse button) and columns dragged from Subitems grid are always copied.
    • Columns are copied to clipboard always with children, preserves their tree structure and default columns.
    • To Tree are pasted columns fully with tree, before focused or in children of focused depending on default column of the copied columns.
    • To Nodes and Items are pasted only with appropriate default columns, NODE or ITEM, always before focused column.
    • All the grids share the same undo queue to correctly undo / redo the moves between grids.
  • Dragging


    Dragging columns in grid can be controlled by Cfg

    DraggingCols

    , it can permit or restrict dragging inside row part, between parts, between parts, etc.
    By which cell can be column caught and dragged is set by row attribute

    UseMove

    , by default set in row D: Header / Index.
    Dragging columns can be more controlled by Cfg

    MoveColTypw

    and in tree by Cfg

    MoveColTree

    . The column tree must be permitted by Cfg

    ColTree

    .
    To drop column(s) from another grid there must be set also Cfg

    AddingCols

    to 2 or 3 in the destination grid.
    To drag and move column(s) to another grid there must be set also Cfg

    DeletingCols

    in the source grid.
  • Dropping permissions


    Dropping permissions are specified by parent column or column part

    Accept

    attribute. It specifies which columns can be dropped to children of the column or column part.
    The columns for the Accept are identified by column attribute

    DragId

    . By default all columns have set DragId = "Col and Accept = "Col".
    The Accept and DragId are usually set in column default, aassigned to column by

    D

    or parent

    CD

    attribute.
  • Copying columns to clipboard


    To copy whole columns to clipboard set

    Copying

    = 3 and restrict row selection by

    SelectingRows

    = 0 and permit column selection by

    SelectingCols

    = 1
    To copy required information for pasting restrictions use Cfg attribute

    CopyStyles

    with values like D or L. And set also

    CopyHtml

    = 1.
    In tree is possible to copy also parents and / or children of selected / focused columns adding Parent or Children to Cfg

    CopyPasteColsType

    .
  • Pasting columns from clipboard


    To add new columns by pasting from clipboard, set Cfg

    PasteFillCols

    = 0,

    PasteAddCols

    = 2,

    PasteFillRows

    = 3 and optionally

    PasteFillSingle

    = 0.
    To use information copied for pasting restrictions use Cfg attribute

    PasteStyles

    with values like D or L. And set also

    PasteHtml

    = 1.
    To more control which columns are where pasted, use API event

    OnPaste

    , here is possible to move or delete the newly added columns.