# Initial Focus

The Kendo UI for Angular Window can move focus to its wrapper or to an element inside it when it opens.

By default, the Window focuses its wrapper. To focus an element inside the Window instead, set the [`autoFocusedElement`](https://www.telerik.com/kendo-angular-ui-develop/components/dialogs/api/windowcomponent#autofocusedelement) property to a CSS selector that matches that element.

The following example focuses the input inside the first `kendo-textbox` when the Window opens.

[Demo Source](https://demos.telerik.com/kendo-angular-ui/demos/dialogs/window/initial-focus/auto-focus/source.txt)

## Setting Initial Focus with Services

When you open a Window through the [`WindowService`](https://www.telerik.com/kendo-angular-ui-develop/components/dialogs/api/windowservice) to create Window instances dynamically based on user interaction, set [`autoFocusedElement`](https://www.telerik.com/kendo-angular-ui-develop/components/dialogs/api/windowsettings#autofocusedelement) in the [`WindowSettings`](https://www.telerik.com/kendo-angular-ui-develop/components/dialogs/api/windowsettings) object.

```ts
constructor(private windowService: WindowService) {}

public openWindowForm(): void {
    const windowRef = this.windowService.open({
      content: UserInfoComponent,
      autoFocusedElement: '#name',
      // You can add other WindowSettings options, such as title or htmlAttributes.
    });
}
```

The following example focuses an input in the content when the service opens the Window.

[Demo Source](https://demos.telerik.com/kendo-angular-ui/demos/dialogs/window/initial-focus/service/source.txt)

## Suggested Links

* [API Reference of the Window](https://www.telerik.com/kendo-angular-ui-develop/components/dialogs/api/windowcomponent)
* [Window Visibility](https://www.telerik.com/kendo-angular-ui-develop/components/dialogs/window/visibility)
* [Window Keyboard Navigation](https://www.telerik.com/kendo-angular-ui-develop/components/dialogs/window/keyboard-navigation)
