Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add an API to focus on elements #22892

Closed
pranavkm opened this issue Jun 12, 2020 · 2 comments
Closed

Add an API to focus on elements #22892

pranavkm opened this issue Jun 12, 2020 · 2 comments
Assignees
Labels
area-blazor Includes: Blazor, Razor Components Done This issue has been fixed enhancement This issue represents an ask for new feature or an enhancement to an existing one

Comments

@pranavkm
Copy link
Contributor

pranavkm commented Jun 12, 2020

A common ask from Blazor users is the ability to perform trivial DOM operations without having to manually write the JavaScript / JSInterop code. Having the ability to focus on DOM elements is one of the more popular ones that we'd like to address.

To solve this, we'd like to introduce FocusAsync() as an extension method to ElementRef types. Here's the usage we think would work the best:

@code {
  ElementRef myRef;

  protected override async Task OnAfterRenderAsync(bool first)
  {
      await myRef.FocusAsync();
      ...
   }
}

This would most likely use JSInterop for it's implementation, but it would be nice not to have to pass in the IJSRuntime instance.

Related issue with lots of feedback: #17472

@pranavkm pranavkm added the area-blazor Includes: Blazor, Razor Components label Jun 12, 2020
@mrpmorris
Copy link

I wouldn't like to have to write code to focus an element. It would be better as a directive...

<input @autofocus/>

But I am not sure if it would be possible to make it work with custom components like <InputText>

@pranavkm
Copy link
Contributor Author

@mrpmorris we have the linked issue open to consider addressing the autofocus attribute. We wanted to independently provide convenience APIs for focus and other DOM operations.

@mkArtakMSFT mkArtakMSFT added the enhancement This issue represents an ask for new feature or an enhancement to an existing one label Jun 15, 2020
@mkArtakMSFT mkArtakMSFT modified the milestones: 5.0.0, 5.0.0-preview8 Jun 15, 2020
@MackinnonBuck MackinnonBuck self-assigned this Jun 22, 2020
@MackinnonBuck MackinnonBuck moved this from Milestone 1 to In progress in Mackinnon's internship Jun 23, 2020
@MackinnonBuck MackinnonBuck moved this from In progress to Done in Mackinnon's internship Jun 26, 2020
@pranavkm pranavkm removed the Working label Jun 26, 2020
@MackinnonBuck MackinnonBuck added the Done This issue has been fixed label Jun 26, 2020
@mkArtakMSFT mkArtakMSFT modified the milestones: 5.0.0, 5.0.0-preview7 Jun 29, 2020
@dotnet dotnet locked as resolved and limited conversation to collaborators Aug 7, 2020
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
area-blazor Includes: Blazor, Razor Components Done This issue has been fixed enhancement This issue represents an ask for new feature or an enhancement to an existing one
Projects
No open projects
Development

No branches or pull requests

4 participants