how do i show password value when editing user details in MVC-CodePudding

I am working on a MVC core project. I have a view on which user can edit user details. I have a input field of type password. When we are creating the user, it works fine in hiding the characters as one type in the textbox, but when I want to edit the user details, the password input does not show a value.

How do I enable an input of type password to show or have a value when editing and at the same time I want to include the show and hide password functionality on the input.

CodePudding user response：

Although, it is not recommended to directly show the user's password, instead you should ask user to enter old password and also have fields for new password.

In order to show value of input password field, you can set type attribute of input field to text.

CodePudding user response：

$(document).ready(function() {
        let model = @Html.Raw(Json.Serialize(Model));

        let passwordEl = $("#Password");
        let showHide = $('#showHidePassword');
        let showHideSpan = $('.icon');

        if (model.InstitutionModel.InstitutionSMTP.Id == 0) {
            passwordEl.attr('type', 'password');
        } else if (model.InstitutionModel.InstitutionSMTP.Id > 0) {
            passwordEl.attr('type', 'password');
        }

        showHide.click(function (e) {
            let type = passwordEl.attr('type') === 'password' ? 'text' : 'password';
            passwordEl.attr('type', type);
            if (showHideSpan.hasClass('fa fa-eye')) {
                showHideSpan.removeClass('fa fa-eye').addClass('fa fa-eye-slash');
            } else {
                showHideSpan.removeClass('fa fa-eye-slash').addClass('fa fa-eye')
            }
        })
    })

 <div >
                    <label  for="accountHolder">Password</label>
                    <div >
                        <input asp-for="Password" id="Password"  type="text" />
                        <div >
                            <button  type="button" id="showHidePassword" style="height:38px;">
                                <span ></span>
                            </button>
                        </div>


                        <span asp-validation-for="Password" ></span>
                    </div>
                </div>