CODEWITHSUNDEEP
javascriptjqueryajaxvalidation
Iman Yasmin
Iman Yasmin

Reputation: 447

Sending data after password validation

I have a form to insert user to a database. On the other side I have two scripts of password validation and ajax script which retrieve php result.

Right now the two script are working separately.

What should I do so that the ajax script run after the password validation?

Password Validation

 function Validate() {
        var password = document.getElementById("UserPwd").value;
        var confirmPassword = document.getElementById("ConfirmUserPwd").value;
        if (password != confirmPassword) {
            alert("Please enter the same password");
            return false;
        }
        return true;
    }

Script

  $.ajax({
      url: "insert_sp.php",
      method: "POST",
      data: {submit: 'true'},
      success: function(response) {

        var data = JSON && JSON.parse(response) || $.parseJSON(response);
        alert(data);
    }
});

Update

isset : if(isset($_POST['Submit']))

button : <input type="submit" name="Submit" value="Submit"/>

$(function() {
  $("#myForm").on("sumbit", function(e) {
    e.preventDefault(); 
    var password = $("#UserPwd").val(),
      confirmPassword = $("#ConfirmPassword").val(); 
    if ($.trim(password) === password && 
        password !== "" &&               
        password === confirmPassword) { 
      $.ajax({
        url: "insert_sp.php",
        method: "POST",
        data: {
          submit: 'true' 
        },
        success: function(response) {
          var data = JSON && JSON.parse(response) || $.parseJSON(response);
          alert(data);
        }
      });
    }
    else {
      alert("Please enter the same password");
    }
  });
});

Upvotes: 0

Views: 544

Answers (2)

mplungjan
mplungjan

Reputation: 177885

  1. Never call anything "submit" in a form. It will hide the submit event if you need it.

  2. Use the form's submit event and event.preventDefault instead of submit buttons click events

  3. If you have jQuery, why not use it all the way?

  4. Remember to do the exact same validation on the server before inserting

I cannot make you a running snippet because SO does not allow submit in their pages. Here is the code - it should work as designed

$(function() {
  $("#myForm").on("submit", function(e) {
    e.preventDefault(); // cancel form submission
    var password = $("#UserPwd").val(),
      confirmPassword = $("#ConfirmPassword").val();
    console.log(password,confirmPassword)  
    if ($.trim(password) === password && // spaces?
      password !== "" && // empty?
      password === confirmPassword) { // the same?
      $.ajax({
        url: "insert_sp.php",
        method: "POST",
        data: {
          Submit: 'true' // remember to change the $_POST test too
        },
        success: function(response) {
          var data = $.parseJSON(response);
          console.log(data);
        }
      });
    } else {
      alert("Please enter the same password");
    }
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<form id="myForm">
  <input type="password" value="" id="UserPwd" /><br/>
  <input type="password" value="" id="ConfirmPassword" /><br/>
  <input type="submit" name="Submit" value="Submit" />
</form>

Upvotes: 2

bharat savani
bharat savani

Reputation: 339

Make a other functuon of ajax request after password validation if success then call ajax function like below.

function ajax_request(){
$.ajax({
url: "insert_sp.php",
method: "POST",
data: {submit: 'true'},    
success: function(response) {
var data=JSON&&JSON.parse(response)||$.parseJSON(response);
alert(data);
console.log(data);
}
});

function Validate() {
var password = document.getElementById("UserPwd").value;
var confirmPassword = document.getElementById("ConfirmPassword").value;
if (password == confirmPassword) {
ajax_request();            
}else{
alert("Wrong Password");
return false;
}
}

Upvotes: 0

Related Questions