jxycms
5/23/2017 - 4:25 AM

check password match

check password match

markup:

<asp:PlaceHolder ID ="newUserPasswordPlaceHolder" runat="server">
    <div class='form-group'>
        <label class='control-label' for='newUserPassword'>Password *</label>
        <asp:TextBox ID="newUserPassword" runat="server" CssClass="form-control" placeholder="Password" MaxLength="110" ClientIDMode="Static"></asp:TextBox>
    </div>
    <div class='form-group'>
        <label class='control-label' for='newUserConfirmPassword'>Confirm Password *</label>
        <asp:TextBox ID="newUserConfirmPassword" runat="server" CssClass="form-control" placeholder="Confirm Password" MaxLength="110" ClientIDMode="Static" onkeyup="checkPass(); return false;"></asp:TextBox>
    </div>
    <div class='form-group'>
        <span id="confirmMessage" class="confirmMessage"></span>
    </div>
</asp:PlaceHolder>


javascript

function checkPass() {
    //Store the password field objects into variables ...
    var pass1 = document.getElementById('newUserPassword');
    var pass2 = document.getElementById('newUserConfirmPassword');
    //Store the Confimation Message Object ...
    var message = document.getElementById('confirmMessage');
    //Set the colors we will be using ...
    var goodColor = "#66cc66";
    var badColor = "#ff6666";
    //Compare the values in the password field 
    //and the confirmation field
    if (pass1.value == pass2.value) {
        //The passwords match. 
        //Set the color to the good color and inform
        //the user that they have entered the correct password 
        pass2.style.backgroundColor = goodColor;
        message.style.color = goodColor;
        message.innerHTML = "Passwords Match!"
    } else {
        //The passwords do not match.
        //Set the color to the bad color and
        //notify the user.
        pass2.style.backgroundColor = badColor;
        message.style.color = badColor;
        message.innerHTML = "Passwords Do Not Match!"
    }
}