使用单击事件在控制台日志中显示响应

Question

I am following a link to allow a person to reset a password, however, everything that I have done so far isn't working and I can't figure out why as I am following the tutorial closely. I am using javascript and html so far, but there are no errors in the console so i am unsure what is wrong.

HTML

<div class="container-forgotPassword">
    <div class ="row justify-content-center"> 
        <div class="row justify-content-center"> 
            <div class="col-md-6 col-md-offset-3" align="center"> 
             <img id="logologin" src="../img/logo1.png" alt="logo"/>
                <input class="formPassword" id="email" placeholder="Please enter your Email Address"> 
                <input type="button" class="btn-forgotPassword" value="Reset Password"> 
            </div>
        </div>
    </div>
</div><!-- /container -->

jQuery

var email = $("#email");
$(document).ready(function () {
$('.btn-forgotPassword').on('click', function () {
    if (email.val() != "") {
        email.css('border', '1px solid green');

        $.ajax({ 
            url: 'php/forgotPassword.php',
            method: 'POST',
            dataType: 'text',
            data: { 
                email: email.val()
            }, success: function (response) { 
                    console.log(response);
            }
        });
    } else 
        email.css('border', '1px solid red');
});
});

In the tutorial so far he has gotten the input box to turn green/ red and when he enters text into the input field and then clicks the button it will create a response in the console log. But as I said mine is doing nothing, does anyone know how I can fix this? Not sure what I am doing wrong

Answer 1

1. you need error callback in ajax to show you the error

2. you miss write. there is no parameter named method in jquery ajax. this should be type

.

$.ajax({ 
    url: 'php/forgotPassword.php',
    type: 'POST', //not method
    dataType: 'text',
    data: { 
        email: email.val()
    }, success: function (response) { 
            console.log('success');
            console.log(response);
    }, error: function(response){
        console.log('error');
        console.log(response); //get all error response
        console.log(response.responseText);//get error responseText
    }
});