SweetAlert 2 pass values over Ajax Request doesn't work

Question

I'm new to js programming.

At the moment, I'm trying to pass the values of a sweetaler pop up to my php query. But it doesnt work.(If i Push the confirm button, the form is going to be closed and nothing happens). This is my js code.

function ChangePassword(){
   swal({
    title: 'Kennwort ändern',
    html:
      '<input id="swal-input1" placeholder ="altes Kennwort" class="swal2-input">' +
      '<input id="swal-input2" placeholder ="neues Kennwort" class="swal2-input">' +
      '<input id="swal-input3" placeholder ="Kennwort wiederholen" class="swal2-input">',
    focusConfirm: false
    }) .then(function(isConfirm) {
        $.ajax({
            type: 'POST',
            url: 'ChangePassword.php',
            data:  {
                'pw_old': document.getElementById('swal-input1').value,
                'pw_new': document.getElementById('swal-input1').value,
                'pw_newconf': document.getElementById('swal-input1').value
            },
            success: function(result) {
                swal({
                    title: result,  
                    type: "success"}

                );
            },
        })

    })

}

Can anybody tell me where my mistake is?

Answer 1

Your input id's are wrong.

Here is the correct code:

function ChangePassword(){

  swal({
   title: 'Kennwort ändern',
   html:
     '<input id="swal-input1" placeholder ="altes Kennwort" class="swal2-input">' +
     '<input id="swal-input2" placeholder ="neues Kennwort" class="swal2-input">' +
     '<input id="swal-input3" placeholder ="Kennwort wiederholen" class="swal2-input">',
   focusConfirm: false
   }) .then(function(isConfirm) {
       $.ajax({
           type: 'POST',
           url: 'ChangePassword.php',
           data:  {
               pw_old: document.getElementById('swal-input1').value,
               pw_new: document.getElementById('swal-input2').value,
               pw_newconf: document.getElementById('swal-input3').value
           },
           success: function(result) {
               swal({
                   title: result,  
                   type: "success"}             
               );
           },
       })

   })
}

I hope that solves your problem