Window HtmlHelper Overview

The Telerik UI Window HtmlHelper for ASP.NET Core is a server-side wrapper for the Kendo UI Window widget.

The Window displays content in a modal or non-modal HTML window. By default, the user can move, resize, and close a Window. Its content can also be defined either as static HTML or dynamically loaded with AJAX.

Initializing the Window

The following example demonstrates how to define the Window by using the Window HtmlHelper.

 @(Html.Kendo().Window()
    .Name("window")
    .Title("Window title")
    .Content(@<text>
            Static content of the Window.
    </text>)
)
    public class WindowController  : Controller
    {
        public IActionResult Index()
        {
            return View();
        }
    }

Basic Configuration

The Window provides default configuration options that can be set during initialization such as height and width, user actions, draggable behavior, initial position, and so on.

The following example demonstrates the basic configuration of the Window HtmlHelper.

@(Html.Kendo().Window()
    .Name("window")
    .Width(500)
    .Height(300)
    .Title("Window title")
    .Visible(true)
    .Actions(actions => actions.Refresh().Minimize().Maximize().Close())
    .LoadContentFrom("AjaxContent", "Window")
    .Draggable(false)
    .Resizable(false)
)

<script type="text/javascript">
    $(function() {
        // The Name() of the Window is used to get its client-side instance.
        var dialog = $("#window").data("kendoWindow");
    });
</script>

Functionality and Features

Events

You can subscribe to all Window events. For a complete example on basic Window events, refer to the demo on using the events of the Window.

Handling by Handler Name

The following example demonstrates how to subscribe to events by handler name.

@(Html.Kendo().Window()
    .Name("window")
    .Events(e => e
        .Open("window_open")
        .Close("window_close")
    )
)
<script>
    function window_open() {
        // Handle the open event.
    }

    function window_close() {
        // Handle the close event.
    }
</script>

Handling by Template Delegate

The following example demonstrates how to subscribe to events by using a template delegate.

@(Html.Kendo().Window()
    .Name("window")
    .Events(e => e
        .Open(@<text>
            function() {
                // Handle the open event inline.
            }
        </text>)
        .Close(@<text>
            function() {
                // Handle the close event inline.
            }
        </text>)
    )
)

See Also

In this article
Not finding the help you need? Improve this article