Jquery steps with ajax confirmtion

Question

Good afternoon, I am stuck with my code. So basically what I am trying to do is checking if the database is connected and if yes move to the next step and if not stay in the same step just showing an alert. BUT even when its not connected it is going to the next step....

What I have so far:

TOP OF THE PAGE:

if (isset($_POST['credentials'])) {
// Database credentials
define('DBHOST', $_POST['database_host']);
define('DBUSER', $_POST['database_name']);
define('DBNAME', $_POST['database_username']);
define('DBPASS', $_POST['database_password']);

try {
    $db = new PDO("mysql:host=".DBHOST.";dbname=".DBNAME, DBUSER, DBPASS);
    $db -> exec("SET CHARACTER SET utf8");
    $db->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);

   echo 'Connected';
exit;   

} catch(PDOException $e) {
    //show error
    echo '<p class="bg-danger">'.$e->getMessage().'</p>';
}


}

BOTTOM OF THE PAGE IN script tag:

$("#wizard").steps({
    headerTag: "h3",
    bodyTag: "section",
    transitionEffect: "none",
    titleTemplate: '<span class="number">#index#</span><span class="bd-wizard-step-title">#title#</span>',
    
    onStepChanged: function(event, currentIndex, priorIndex){
        if (currentIndex == 1) {
            var database_host = $('#hostname').val();
            var database_name = $('#name').val();
            var database_username = $('#username').val();
            var database_password = $('#password').val();
            
            
            $.ajax({
                 url  : "<?= $_SERVER['PHP_SELF'] ?>",
                 type : "POST",
                 async: false, 
                 dataType: 'text',
                 data : 
                 {
                    'credentials' : 1,
                    'database_host' : database_host,
                    'database_name' : database_name,
                    'database_username' : database_username,
                    'database_password' : database_password
                 },
                success:function(re){
                    if (re == "Connected") {
                        alert("Connected");
                    } else {
                        alert("Rejected");
                        return false;
                    }
                }
            });

        }
    }
});

Any ideas how to solve it? I would be much appreciated

P.S: I already put "return false;" but still going to the next step...

I am using http://www.jquery-steps.com

Async false wont help here, because your response from PHP is going to be considered a 'success' callback regardless (it returned a 200 code with body). Return false in the success is only returning false from that function (which goes nowhere). — IncredibleHat, Jul 03 '20 at 03:22

score 0 · Answer 1 · answered Jul 03 '20 at 00:07

0

AJAX is async by default you would need to set async to false I believe: jQuery wizard steps move before ajax call completed

answered Jul 03 '20 at 00:07

otw

630
4
13

As you can see the async is false already in my code.. – Rodrigo Pacheco Jul 03 '20 at 00:09
Ah sorry just saw that, are you sure it is not throwing an error? Try adding an error handler perhaps and see if that's the issue? – otw Jul 03 '20 at 00:30

Jquery steps with ajax confirmtion

1 Answers1