CODEWITHSUNDEEP
javascriptforms
Janel Sangalan
Janel Sangalan

Reputation: 41

Comparing Password in Javascript

I'm comparing password in javascript and someone its not working its working on my past project before here is the HTML

<form>
        <label>
            <strong>Username</strong>
            <input type="text" name="">
        </label>
        <label>
            <strong>Password</strong>
            <input type="password" name="" id="password">
        </label>
        <label>
            <strong>Confirm Password</strong>
            <input type="password" name="" id="confirmpassword"> 
        </label>
        <button class="button" type="submit" id="button" onclick="click();">Submit</button>
    </form>

and here is javascript

function click (){
    var password =  document.getElementID('password').value,
    confirmpassword =   document.getElementID('confirmpassword').value

    if (password == ""){
        alert("Field cannot be empty.");

        
    }
    else if (password != confirmpassword){
        alert("Password didnt match try again.");
        return false

    }
    else if(password == confirmpassword){
        alert("Password Match")
        
    }
    return false
}

Upvotes: 0

Views: 531

Answers (4)

barzin.A
barzin.A

Reputation: 1582

you should change your function name because 'click' not working change it to for example submit and it works fine;

function submit (){
    var password =  document.getElementById('password').value,
    confirmpassword =   document.getElementById('confirmpassword').value

    if (password == ""){
        alert("Field cannot be empty.");

        
    }
    else if (password != confirmpassword){
        alert("Password didnt match try again.");
        return false

    }
    else if(password == confirmpassword){
        alert("Password Match")
        
    }
    return false
}
        <label>
            <strong>Username</strong>
            <input type="text" name="">
        </label>
        <label>
            <strong>Password</strong>
            <input type="password" name="" id="password">
        </label>
        <label>
            <strong>Confirm Password</strong>
            <input type="password" name="" id="confirmpassword"> 
        </label>
        <button class="button" type="button" id="button" onclick="submit();">Submit</button>

Upvotes: 0

Swaraj Gandhi
Swaraj Gandhi

Reputation: 714

You can try this:

HTML:

<form id="form-id">
        <label>
            <strong>Username</strong>
            <input type="text" name="">
        </label>
        <label>
            <strong>Password</strong>
            <input type="password" name="" id="password">
        </label>
        <label>
            <strong>Confirm Password</strong>
            <input type="password" name="" id="confirmpassword"> 
        </label>
        <button id="your-id">submit</button>
    </form>

JS:

var form = document.getElementById("form-id");

document.getElementById("your-id").addEventListener("click", function () {
  var password = document.getElementById("password").value,
    confirmpassword = document.getElementById("confirmpassword").value;

  if (password == "") {
    alert("Field cannot be empty.");
  } else if (password != confirmpassword) {
    alert("Password didnt match try again.");
    return false;
  } else if (password == confirmpassword) {
    alert("Password Match");
    form.submit();
  }
});

Upvotes: 0

Vishnu Vinod
Vishnu Vinod

Reputation: 765

Try adding onSubmit to the form tag and call the function there instead of in the submit button Example:

<form name="myForm" onsubmit="return click();">

And remove the onClick from submit button

And it is not getElementID. It is getElementById()

Upvotes: 0

Everest Climber
Everest Climber

Reputation: 1243

You are using getElementID to get password field value, but there is no document.getElementID function.

It should be document.getElementById to get that field value.

Upvotes: 2

Related Questions