Send multiple variable to php file with ajax? Undefined index?

Question

I am very new to Ajax and need to send 2 variables instead one 1 to a php file. I have 2 text input forms - after the value of the 2nd one is entered (the 2nd input is only shown if the first is entered) I need to send both the input from the FIRST INPUT along with the SECOND INPUT to a php file.

Here are my form/inputs:

echo '<form class="changePassForm" action="" method="post" enctype="multipart/form-data">';
echo '<input class = "passwordText" type="password" placeholder="Change Password" name="passwordText">';
echo '<input class = "oldPass" type="password" placeholder="Enter Old Password" name="oldPass">';
echo '</form>';

The javascript that currently send the variable containing input from the SECOND input only:

$(".passwordText").keydown(function(event){
    if(event.keyCode == 13){
      var pass = $(this).val();

    $(".oldPass").keydown(function(event){
    if(event.keyCode == 13){
      var oldPass = $(this).val();
        //var pass = document.getElementById("p2");
    $.ajax({
        url: "../php/passwordchange2.php", // Url to which the request is send
        type: "POST",             // Type of request to be send, called as method
        data: 'oldPass=' + oldPass+'passwordText=' + pass, // data sent to php file
        //data: {pass:"passwordText",oldPass:"oldPass"}
        success: function(data)   // A function to be called if request succeeds
        {
            console.log(data);
            //$('.passwordText').slideUp(500)

        }});    
     console.log("WORKS now!!");   
    }
});
     //console.log("WORKS!!");   
    }
});

And my php which should echo both. As it is, only pass is echoed:

session_start();
include("../php/Session.class.php");
$sess = new Session();
$sess->Init();
$cookie = isset($_COOKIE["session"]); 
if($cookie) 
{
$cookie = $_COOKIE["session"];
$account = $sess->Verify($cookie);
}

$pass1=$_POST['passwordText']; //name of input
    echo $pass1;    

$pass=$_POST['oldPass']; //name of input
    echo $pass;

I am getting the error Undefined index: passwordText How can I fix this?

Answer 1

You are just missing "&" in your code:

data: 'oldPass=' + oldPass+'&passwordText=' + pass, // data sent to php file

OR

data:{"oldPass":oldPass,"passwordText":pass}

Answer 2

way of sending ajax request with multiple data

$.ajax({
        method: "POST",
        url: /post_url,
        dataType: "json",
        data: {var1 : data1,
               var2 : data2,
               var3 : data3
              },
        beforeSend: function () {
         //do something
                  },
        error: function () {
          // do something                         
                  },
        success: function (r) {
                 //do something

                      }
        });

your javascript logic is not clear, you should modify it like this and define varibles globally.

var pass=''; var oldPass='';

$(".passwordText").keydown(function(event){
    if(event.keyCode == 13){
       pass = $(this).val();
    }
});

$(".oldPass").keydown(function(event){
if(event.keyCode == 13){
  oldPass = $(this).val();
    $.ajax({
        url: "../php/passwordchange2.php", // Url to which the request is send
        type: "POST",             // Type of request to be send, called as method
        data: {pass:pass,oldPass:oldPass}// data sent to php file
        success: function(data)   // A function to be called if request succeeds
        {
            console.log(data);
        }
    });    
 console.log("WORKS now!!");   
}
});