0
219
Vistas¿Cómo muestro el valor de la contraseña al editar los detalles del usuario en MVC?
Estoy trabajando en un proyecto central de MVC. Tengo una vista sobre qué usuario puede editar los detalles del usuario. Tengo un campo de entrada de tipo contraseña. Cuando estamos creando el usuario, funciona bien al ocultar los caracteres como un tipo en el cuadro de texto, pero cuando quiero editar los detalles del usuario, la entrada de la contraseña no muestra un valor.
¿Cómo habilito una entrada de tipo contraseña para mostrar o tener un valor al editar y al mismo tiempo quiero incluir la funcionalidad de mostrar y ocultar contraseña en la entrada?
3 Respuestas
Responde la pregunta0
$(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 class="form-group row "> <label class="col-sm-3 col-form-label control-label" for="accountHolder">Password</label> <div class="col-sm-9 input-group required_field"> <input asp-for="Password" id="Password" class="form-control border border-secondary" type="text" /> <div class="input-group-append"> <button class="btn btn-primary" type="button" id="showHidePassword" style="height:38px;"> <span class="fa fa-eye icon"></span> </button> </div> <span asp-validation-for="Password" class="text-danger"></span> </div> </div>`
0
Puede usar un botón para cambiar el tipo de entrada, aquí hay una demostración:
html:
<input type="password" id="passwd" name="passwd"> <button type="button" id="eye" onclick="ShowPassword()"> <img src="https://cdn0.iconfinder.com/data/icons/feather/96/eye-16.png" alt="eye" /> </button>js:
function ShowPassword() { var s = document.getElementById("passwd"); s.type = s.type == "password" ? "text" : "password"; }resultado:
0
Aunque no se recomienda mostrar directamente la contraseña del usuario, en su lugar, debe pedirle al usuario que ingrese la contraseña anterior y también tener campos para la nueva contraseña.
Para mostrar el valor del campo de contraseña de entrada, puede establecer el atributo de type del campo de entrada en text .