Обновлять скрытое значение поля при каждом нажатии

Question

У меня есть форма MVC с полями Name, Email, ConfirmEmail.Когда я начну печатать в поле ConfirmEmail, поле электронной почты должно быть замаскировано *.Форму следует размещать только при совпадении полей Email и ConfirmEmail.

Я начал с атрибута аннотации данных Compare в MVC, но когда я написал функцию keypress для маскировки Email поле в *, атрибут Compare начал выдавать ошибку, потому что значение поля электронной почты изменяется.

Затем я написал jQuery код для достижения этого, у меня есть hidden field в котором я сохраняю исходное значение Email и пытаюсь обновить значение скрытого поля при каждом изменении поля электронной почты.Это скрытое поле не обновляется должным образом и проверка не проходит.Пожалуйста, помогите.

Ниже мой код:

Форма MVC:

<form>
@Html.TextBoxFor(m => m.Name, new { @class = "form-control" })
<span id="spanFirstName" class="alert-danger"></span>

@Html.TextBoxFor(m => m.Email, new { @class = "form-control"})
<span id="spanEmail" class="alert-danger"></span

 @Html.TextBoxFor(m => m.ConfirmEmail, new { @class = "form-control"})
<span id="spanConfirmEmail" class="alert-danger"></span>
<input type="submit" data-attr="SendEmail" class="btn btn-primary" value="Post" />
</form>

jQuery Код:

         $(document)
            .on("keypress", "#Email", function (e) {
                if ($('#Email').val().indexOf('*') !== -1) {
                    $('#hiddenEmail').val($('#hiddenEmail').val());
                }
                else {
                    $('#hiddenEmail').val($('#Email').val());
                }
            });

        $(document)
            .on("keypress", "#ConfirmEmail", function (e) {
                if ($('#Email').val() !== null || $('#Email').val() !== '') 
                {
                   $('#Email').val($('#Email').val().replace(/[^\s]/g,"*"));
                }
            });

        $(document)
            .off("click", "[data-attr='SendEmail']")
            .on("click", "[data-attr='SendEmail']", function (e) {
                validate();
            });

function validate() {
        var firstName = $('#Name').val();
        var email = $('#Email').val();
        var confirmEmail = $('#ConfirmEmail').val();
        var hiddenEmail = $('#hiddenEmail').val();
        if (hiddenEmail !== "" && confirm !== "") {
            if (hiddenEmail !== confirmEmail) {
                $('#spanConfirmEmail').text('Email Addresses do not match');
            }
            else {
                $('#spanConfirmEmail').text('');
            }
        }
    }