title | page_title | description | slug | canonicalLink | position |
---|---|---|---|---|---|
Actions |
Customizing Actions - Window - Kendo UI for Vue |
Use the predefined and create custom user actions when working with the Kendo UI Window wrapper for Vue. |
actions_window_wrapper |
4 |
The following example demonstrates how to create a modal Window with a predefined position and enable all user actions.
The order of the values in the actions
array determines the order in which the action buttons are rendered in the title of a Window. The maximize
action serves both as a button for expanding a Window to fill the screen and as a button to restore a Window to its previous size. The minimize
action collapses a Window to its title.
{% meta height:370 %} {% embed_file actions/predefined/main.vue preview %} {% embed_file actions/predefined/main.js %} {% endmeta %}
If the user supplies a non-recognized action name, the Window treats that action name as a custom action. As a result, the Window renders the k-icon
and k-i-actionname
(all lowercase) CSS classes for it and does not automatically attach a click
event handler. By default, the Kendo UI stylesheets provide an icon for "custom"
-named actions—however, you can use any other name for the non-recognized action and then capture and handle the click
events in a standard way.
{% meta height:370 %} {% embed_file actions/custom/main.vue preview %} {% embed_file actions/custom/main.js %} {% endmeta %}