CODEWITHSUNDEEP
javascripthtml
Humble_boy
Humble_boy

Reputation: 1403

Can we use onsubmit and action together for the same form in javascript?

I'm a newbie to javascript, I'm working on a change password module. I have two pages, changepassword.php and change.php. In the changepassword.php, I'm just defining the elements. In the change.php, I'm handling the database. It was working fine. This is the first version code which worked fine

changepassword.php

<form action="change.php" method="POST">

<label for="npass">New Password:</label>
<input type="password" id="npass" placeholder="Enter New Password" 
name="newpassword" required="required">

<label for="cpass">Confirm Password:</label>
<input type="password" id="cpass" placeholder="Confirm New Password" 
name="cpass" required="required">
<input type="submit" class="btn btn-info" name="submit" value="Submit">
</form>

change.php

<?php

session_start();

include("dbconn.php");

if(!empty($_POST))
{
    $user_id=$_SESSION['userid'];    
    $npass=$_POST['newpassword'];
    $pas=$_POST['cpass'];

    $que = "update user set password='$npass', last_login='1' where 
    user_id='$user_id' ";

    if ($conn->query($que)==TRUE);
    {
        echo "Password Changed";
        header("Location:home.php");       
    }

}
else
{
    header("changepassword.php");
}

The above code worked fine. It updated the table as expected. Now the problem is, I modified the changepassword.php code for validation purpose using javascript. After I updated the code, The values are not getting updated in the database.

Modified changepassword.php

function f1()
{
    var newpass = document.getElementById('npass').value;
    var confirmpass = document.getElementById('cpass').value;

    if(newpass!=confirmpass)
    {
        document.getElementById('npass').value = "";
        document.getElementById('cpass').value = "";
        alert("Password Mismatch. Please enter again!");                
    }
    else
    {
        alert("Password Match");
        window.location.href = "home.php";
    }            
        return false;            
}

<form method="POST" onsubmit="return f1()" action="change.php">


<label for="npass">New Password:</label>
<input type="password" id="npass" placeholder="Enter New Password" 
name="newpassword" required="required" maxlength="8">


 <label for="cpass">Confirm Password:</label>
 <input type="password" id="cpass" placeholder="Confirm New Password" 
 name="cpass" required="required" maxlength="8"><br><br>
 <input type="submit" class="btn btn-info" name="submit" value="Submit">
 </form>

After this the change.php is not getting invoked and the values are not getting updated in the database. Any help ! Thanks.

Upvotes: 0

Views: 259

Answers (1)

user1838937
user1838937

Reputation: 299

Try this:

if(newpass!=confirmpass)
{
    document.getElementById('npass').value = "";
    document.getElementById('cpass').value = "";
    alert("Password Mismatch. Please enter again!");

    return false;    
} else...

Upvotes: 1

Related Questions