Can the inplace editor hide text?

[Jose]

                        <SfInPlaceEditor @bind-Value="@BindingProto.Password"  ShowButtons="false" TValue="string">

                            <EditorComponent>

                                <SfTextBox @bind-Value="@BindingProto.Password" Placeholder="Enter pass" Type="Syncfusion.Blazor.Inputs.InputType.Password"></SfTextBox>

                            </EditorComponent>

                        </SfInPlaceEditor>

Above I have an inplace editor holding a text box. When I edit the textbox, I get a hidden string as it is a password, but when I focus out, the inplace editor displays the password. Is there anyway to prevent this from happening?

[Kokila Poovendran]

Hi Jose,

We have validated your query and prepared a sample as per your requirement. Kindly check the code snippet below:

<SfInPlaceEditor @bind-Value="@BindingProto.Name" ShowButtons="false" TValue="string" @ref=inplaceObj>

 

    <EditorComponent>

 

        <SfTextBox ID="textBox" @bind-Value="@BindingProto.Password" Placeholder="Enter pass" Type="Syncfusion.Blazor.Inputs.InputType.Password"></SfTextBox>

 

    </EditorComponent>

    <InPlaceEditorEvents TValue="string" OnActionSuccess="Successhanlder"></InPlaceEditorEvents>

 

</SfInPlaceEditor>

 

@code {

    SfInPlaceEditor<string> inplaceObj;

 

    private string password = "YourInitialPassword";

 

    private MyBindingModel BindingProto = new MyBindingModel();

 

    private class MyBindingModel

    {

        public string Password { get; set; }

 

        public string Name { get; set; }

    }

 

    private void Successhanlder(ActionEventArgs<string> args)

    {

        if(args.Value != null)

        {

            args.Value = new string('*', args.Value.ToString().Length);

        }

    }

   

}

This code will ensure that the password is displayed as a series of asterisk symbols after editing, meeting your requirement.

Regards,

Kokila Poovendran.