Docs
API
  • rowdrag

    Row drag and drop column type

    Column with row drag and drop elements. It requires to enable rowDragDrop: true.

    Example

    
    columns: [{
    ...
    },{
      type: 'rowdrag',
      locked: true
    },{
    ...
    

    cls

    String

    Column css className.

    
    .my-select {
      background-color: #ccc;
    }
    ...
    columns: [{
      type: 'select',
      cls: 'my-select'
    },{
    ...
    

    draggable

    Boolean

    Allows column to be dragged.

    
    draggable: true,
    
    false

    hidden

    Boolean

    Hide column on start.

    
    {
      index: 'married',
      resizable: true,
      type: 'checkbox',
      title: 'Married',
      width: 100,
      hidden: true
    }
    
    false

    lockable

    Boolean

    Enable/disable column locking.

    
    locked: false,
    
    true

    locked

    Boolean

    Locking column.

    
    {
      type: 'select',
      width: 65,
      locked: true
    }
    
    False

    maxWidth

    Number

    The maximum width of column.

    
    maxWidth: 150,
    

    menu

    Mixed

    Enables column menu.

    
    menu: true,
    

    Example: Custom Default menu

    
    menu: ['sort', '-', 'columns', '-', 'lock'],
    

    Example: Custom menu

    
    menu: ['columns', '-', {
      text: 'Hi',
      handler: function(){
    	alert('Hi');
      }
    }],
    

    Example: One menu with columns only

    
    menu: 'columns',
    
    false

    minWidth

    Number

    The minimum width of column.

    
    minWidth: 80,
    

    resizable

    Boolean

    Enable resizing of column.

    
    resizable: true,
    
    False

    rightLocked

    Boolean

    Locking column to right side.

    
    {
      type: 'select',
      width: 65,
      rightLocked: true
    }
    
    False

    type

    String

    Column type.

    
    {
      type: 'select'
    }
    

    width

    Number

    column width.

    
    {
      type: 'select',
      width: 65
    }