New to Kendo UI for jQuery? Start a free 30-day trial

ContextMenu

configuration

Configures the ContextMenu of the PropertyGrid. If set to true enables the default ContextMenu.

contextMenu

Object|Boolean

Default: false

<div id="propertyGrid"></div>
<script>
$("#propertyGrid").kendoPropertyGrid({
    contextMenu: true,
    model: {
        foo: "bar",
        baz: 5
    }
});
</script>

Configures the items of the ContextMenu for the table body element. Those are some valid predefined tools: "separator", "copy", "copyName", "copyDeclaration", "resize", "reset", "expandItem", "collpaseItem".

You can also specify a custom item and associate it with a command.

<div id="propertyGrid"></div>
<script>
    $("#propertyGrid").kendoPropertyGrid({
        columns: {
            fieldColumn: { width: 200 },
            valueColumn: { width: 250 }
        },
        model: {
            foo: "bar",
            baz: 5
        },
        contextMenu: {
            body: [
                "copyDeclaration",
                "separator",
                "resize",
                { name: "MyCustomCommand", text: "Save State", icon: "gear", command: "CustomCommand" }
            ]
            // You can also concat to the default tools
            // body: kendo.ui.propertygrid.defaultBodyContextMenu.concat([
            //     { name: "MyCustomCommand", text: "SaveState", icon: "gear", command: "CustomCommand" }
            // ])
        }
    });

    kendo.ui.propertygrid.commands["CustomCommand"] = kendo.ui.propertygrid.PropertyGridCommand.extend({
        exec: function() {
            var that = this,
                propertyGrid = that.propertyGrid;

            propertyGrid.saveState();
        }
    });
</script>

ContextMenu

contextMenu

contextMenu.body

Related Members