Example of Overview in Blazor InPlace Editor Component

InPlace Editor / In-place Editor / Overview

This sample demonstrates the default functionalities of the Blazor In-place Editor component. Click on the dotted input element to switch to the editable state and save or cancel it by clicking the actions buttons.

Properties
Mode
Editable On
Show Buttons
Disable

Using the In-place Editor component, you can edit the values and update them to the server.

The In-place Editor modes can be switched by selecting the appropriate values provided in a drop-down. The applicable editor positions are as follows:

  • Inline
  • Pop-up

The edit on modes of the In-place Editor can be switched by selecting the appropriate values provided in a drop-down. The applicable modes are as follows:

  • Click - The editor opens the edit input by single-clicking on the textbox.
  • DblClick - The editor opens the edit input by double-clicking on the textbox.
  • EditIconClick - The editor can open the edit input only by clicking on the edit icon, which is visible on the hover of the textbox.

The Save and Cancel buttons of the In-place Editor component can be shown or hidden by switching the Show Buttons check box state. You can save the data by clicking outside the target or pressing the Enter key while disabling the action buttons. You can cancel the edit request by pressing the Esc key.

See also

Transform your Blazor web apps today with Syncfusion® Blazor components
100+ high-performance and responsive UI components
Dedicated support
Hassle-free licensing
TRY IT FOR FREE