columnMenu.messages Object

The text messages displayed in the column menu. Use it to customize or localize the column menu messages.

Example - customize column menu messages

<div id="grid"></div>
<script>
$("#grid").kendoGrid({
  columns: [
    { field: "name" },
    { field: "age" }
  ],
  columnMenu: {
    messages: {
      columns: "Choose columns",
      filter: "Apply filter",
      sortAscending: "Sort (asc)",
      sortDescending: "Sort (desc)"
    }
  },
  sortable: true,
  filterable: true,
  dataSource: [
    { name: "Jane Doe", age: 30 },
    { name: "John Doe", age: 33 }
  ]
});
</script>

columnMenu.messages.apply String (default: "Apply")

The text of the button which applies the columns filter.

The button is visible when the column menu componentType is set to modern or tabbed.

Example - column menu apply button text

<div id="grid"></div>
<script>
$("#grid").kendoGrid({
  columns: [
    { field: "id", width:200 },
    { field: "name", width:400 },
    { field: "age", width:400 }
  ],
  columnMenu: {
    componentType: "modern",
    messages: {
      apply: "Apply Columns"
    }
  },
  sortable: true,
  dataSource: [
    { id: 1, name: "Jane Doe", age: 30 },
    { id: 2, name: "John Doe", age: 33 }
  ]
});
</script>

columnMenu.messages.autoSizeColumn String (default: "Autosize This Column")

The text of the autosize single column option.

The autosize option is visible when the column menu componentType is set to tabbed.

Example - column menu apply button text

<div id="grid"></div>
<script>
$("#grid").kendoGrid({
  columns: [
    { field: "id", width:200 },
    { field: "name", width:400 },
    { field: "age", width:400 }
  ],
  columnMenu: {
    componentType: "tabbed",
    autoSize: true,
    messages: {
      autoSizeColumn: "Custom Autosize this column"
    }
  },
  sortable: true,
  dataSource: [
    { id: 1, name: "Jane Doe", age: 30 },
    { id: 2, name: "John Doe", age: 33 }
  ]
});
</script>

columnMenu.messages.autoSizeAllColumns String (default: "Autosize All Columns")

The text of the autosize single column option.

The autosize option is visible when the column menu componentType is set to tabbed.

Example - column menu apply button text

<div id="grid"></div>
<script>
$("#grid").kendoGrid({
  columns: [
    { field: "id", width:200 },
    { field: "name", width:400 },
    { field: "age", width:400 }
  ],
  columnMenu: {
    componentType: "tabbed",
    autoSize: true,
    messages: {
      autoSizeAllColumns: "Custom Autosize all columns"
    }
  },
  sortable: true,
  dataSource: [
    { id: 1, name: "Jane Doe", age: 30 },
    { id: 2, name: "John Doe", age: 33 }
  ]
});
</script>

columnMenu.messages.buttonTitle String (default: "{0} edit column settings")

The title of the button that displays the ColumnMenu.

The {0} argument represents the field name

Example - set the ColumnMenu "buttonTitle" message

<div id="grid"></div>
<script>
$("#grid").kendoGrid({
  columns: [
    { field: "name", width:400 },
    { field: "age", width:400 }
  ],
  columnMenu: {
    messages: {
      buttonTitle: "{0} Column Menu"
    }
  },
  sortable: true,
  dataSource: [
    { id: 1, name: "Jane Doe", age: 30 },
    { id: 2, name: "John Doe", age: 33 }
  ]
});
</script>

columnMenu.messages.columns String (default: "Columns")

The text message displayed for the column selection menu item.

Example - set the column selection message

<div id="grid"></div>
<script>
$("#grid").kendoGrid({
  columns: [
    { field: "name" },
    { field: "age" }
  ],
  columnMenu: {
    messages: {
      columns: "Choose columns"
    }
  },
  dataSource: [
    { name: "Jane Doe", age: 30 },
    { name: "John Doe", age: 33 }
  ]
});
</script>

columnMenu.messages.filter String (default: "Filter")

The text message displayed for the filter menu item.

Example - set the filter message

<div id="grid"></div>
<script>
$("#grid").kendoGrid({
  columns: [
    { field: "name" },
    { field: "age" }
  ],
  columnMenu: {
    messages: {
      filter: "Apply filter",
    }
  },
  filterable: true,
  dataSource: [
    { name: "Jane Doe", age: 30 },
    { name: "John Doe", age: 33 }
  ]
});
</script>

columnMenu.messages.lock String (default: "Lock Column")

The text message displayed in the column menu for locking a column.

Example - column menu lock button text

<div id="grid"></div>
<script>
$("#grid").kendoGrid({
  columns: [
    { locked: true, field: "id", width:200 },
    { field: "name", width:400 },
    { field: "age", width:400 }
  ],
  columnMenu: {
    messages: {
      lock: "Pin this column"
    }
  },
  sortable: true,
  dataSource: [
    { id: 1, name: "Jane Doe", age: 30 },
    { id: 2, name: "John Doe", age: 33 }
  ]
});
</script>

columnMenu.messages.moveNext String (default: "Move next")

The text message that is displayed for the Move to next position column menu item.

columnMenu.messages.movePrev String (default: "Move previous")

The text message that is displayed for the Move to previous position column menu item.

columnMenu.messages.groupColumn String (default: "Group column")

The text message that is displayed for the Group column menu item.

columnMenu.messages.ungroupColumn String (default: "Ungroup column")

The text message that is displayed for the Ungroup column menu item.

columnMenu.messages.reset String (default: "Reset")

The text of the button which resets the columns filter.

The button is visible when the column menu componentType is set to modern or tabbed.

Example - column menu reset button text

<div id="grid"></div>
<script>
$("#grid").kendoGrid({
  columns: [
    { field: "id", width:200 },
    { field: "name", width:400 },
    { field: "age", width:400 }
  ],
  columnMenu: {
    componentType: "modern",
    messages: {
      reset: "Reset Columns"
    }
  },
  sortable: true,
  dataSource: [
    { id: 1, name: "Jane Doe", age: 30 },
    { id: 2, name: "John Doe", age: 33 }
  ]
});
</script>

columnMenu.messages.sortAscending String (default: "Sort Ascending")

The text message displayed for the menu item which performs ascending sort.

Example - set the sort ascending message

<div id="grid"></div>
<script>
$("#grid").kendoGrid({
  columns: [
    { field: "name" },
    { field: "age" }
  ],
  columnMenu: {
    messages: {
      sortAscending: "Sort (asc)",
    }
  },
  sortable: true,
  dataSource: [
    { name: "Jane Doe", age: 30 },
    { name: "John Doe", age: 33 }
  ]
});
</script>

columnMenu.messages.sortDescending String (default: "Sort Descending")

The text message displayed for the menu item which performs descending sort.

Example - set the sort descending message

<div id="grid"></div>
<script>
$("#grid").kendoGrid({
  columns: [
    { field: "name" },
    { field: "age" }
  ],
  columnMenu: {
    messages: {
      sortDescending: "Sort (desc)",
    }
  },
  sortable: true,
  dataSource: [
    { name: "Jane Doe", age: 30 },
    { name: "John Doe", age: 33 }
  ]
});
</script>

columnMenu.messages.setColumnPosition String (default: "Set Column Position")

The text message displayed in the column menu for the column position item.

Example - column menu set column position text

<div id="grid"></div>
<script>
$("#grid").kendoGrid({
  columns: [
    { field: "id", width: 800 },
    { field: "name", width: 400, sticky: true, stickable: true },
    { field: "age", width: 800 }
  ],
  columnMenu: {
    messages: {
      setColumnPosition: "Change Position"
    }
  },
  dataSource: [
    { id: 1, name: "Jane Doe", age: 30 },
    { id: 2, name: "John Doe", age: 33 }
  ]
});
</script>

columnMenu.messages.settings String (default: "Column Settings")

The text message displayed in the menu header (available in mobile mode only).

Example - mobile column menu header

<div id="grid"></div>
<script>
$("#grid").kendoGrid({
  columns: [
    { field: "name" },
    { field: "age" }
  ],
  columnMenu: {
    messages: {
      settings: "Column Options",
    }
  },
  mobile: "phone",
  height: 550,
  sortable: true,
  dataSource: [
    { name: "Jane Doe", age: 30 },
    { name: "John Doe", age: 33 }
  ]
});
</script>

columnMenu.messages.stick String (default: "Stick Column")

The text message displayed in the column menu for sticking a column.

Example - column menu stick button text

<div id="grid"></div>
<script>
$("#grid").kendoGrid({
  columns: [
    { field: "id", width: 800 },
    { field: "name", width: 400, sticky: true, stickable: true },
    { field: "age", width: 800 }
  ],
  columnMenu: {
    messages: {
      stick: "Stick this column"
    }
  },
  dataSource: [
    { id: 1, name: "Jane Doe", age: 30 },
    { id: 2, name: "John Doe", age: 33 }
  ]
});
</script>

columnMenu.messages.unstick String (default: "Unstick Column")

The text message displayed in the column menu for unsticking a column.

Example - column menu unstick button text

<div id="grid"></div>
<script>
$("#grid").kendoGrid({
  columns: [
    { field: "id", width: 800 },
    { field: "name", width: 400, sticky: true, stickable: true },
    { field: "age", width: 800 }
  ],
  columnMenu: {
    messages: {
      unstick: "Unstick this column"
    }
  },
  dataSource: [
    { id: 1, name: "Jane Doe", age: 30 },
    { id: 2, name: "John Doe", age: 33 }
  ]
});
</script>

columnMenu.messages.unlock String (default: "Unlock Column")

The text message displayed in the column menu for unlocking a column.

Example - column menu unlock button text

<div id="grid"></div>
<script>
$("#grid").kendoGrid({
  columns: [
    { locked: true, field: "id", width:200 },
    { field: "name", width:400 },
    { field: "age", width:400 }
  ],
  columnMenu: {
    messages: {
      unlock: "Unpin this column"
    }
  },
  sortable: true,
  dataSource: [
    { id: 1, name: "Jane Doe", age: 30 },
    { id: 2, name: "John Doe", age: 33 }
  ]
});
</script>