gridstack - v12.3.3
    Preparing search index...

    Class DDGridStack

    HTML Native Mouse and Touch Events Drag and Drop functionality.

    This class provides the main drag & drop implementation for GridStack, handling resizing, dragging, and dropping of grid items using native HTML5 events. It manages the interaction between different DD components and the grid system.

    Index

    Constructors

    constructor

    Methods

    draggable dragIn droppable isDraggable isDroppable isResizable off on resizable

    Constructors

    Methods

    • Enable/disable/configure dragging for grid elements.

      Parameters

      • el: GridItemHTMLElement

        Grid item element(s) to configure

      • opts: any

        Drag options or command ('enable', 'disable', 'destroy', 'option', or config object)

      • Optionalkey: DDKey

        Option key when using 'option' command

      • Optionalvalue: DDValue

        Option value when using 'option' command

      Returns DDGridStack

      this instance for chaining

      dd.draggable(element, 'enable');  // Enable dragging
      dd.draggable(element, {handle: '.drag-handle'});  // Configure drag handle

    • Enable/disable/configure resizing for grid elements.

      Parameters

      • el: GridItemHTMLElement

        Grid item element(s) to configure

      • opts: any

        Resize options or command ('enable', 'disable', 'destroy', 'option', or config object)

      • Optionalkey: DDKey

        Option key when using 'option' command

      • Optionalvalue: DDValue

        Option value when using 'option' command

      Returns DDGridStack

      this instance for chaining

      dd.resizable(element, 'enable');  // Enable resizing
      dd.resizable(element, 'option', 'minWidth', 100);  // Set minimum width

    Settings

    Member Visibility

    On This Page

    Constructors
    Methods