Ajax did not get a reply after sending POST to PHP

62 views Asked by At

I'm building a website a simple registration form. I send data via AJAX and can not get a positive or negative answer to the request. If I send directly to a PHP file, everything works, if using AJAX, AFTERSUCCESS not do anything. I use Jquery, and JQUERYFORMS

index.php:

<form class="uk-form" id="register_frm" action="php/register.php" method="POST" enctype="multipart/form-data">
    <input type="email" name="email" id="email" class="uk-width-1-1 uk-form-large" value="[email protected]">
    <input value="111" type="password" name="pass" id="pass" class="uk-width-1-1 uk-form-large" >
    <input value="111" type="password" name="pass2" id="pass2" class="uk-width-1-1 uk-form-large">
    <button class="uk-button uk-button-primary uk-button-large uk-align-center" type="submit" name="submit_btn" id="submit_btn" value="reg">Register <i class="uk-icon uk-icon-spin uk-icon-spinner" id="output"></i></button>
    <div id="output"></div>
</form>

Javascript:

$(document).ready(function() {
    $("#register_frm").submit(function(event){
        var options = { 
            target:   '#output',   // target element(s) to be updated with server response 
            beforeSubmit:  beforeSubmit,  // pre-submit callback 
            success:       afterSuccess,  // post-submit callback 
            uploadProgress: OnProgress, //upload progress callback
            dataType    : 'json',
            resetForm: false        // reset the form after successful submit 
        }; 

        $('#register_frm').ajaxSubmit(options);            
        // always return false to prevent standard browser submit and page navigation 
        return false;

        function afterSuccess(data)
        {
            console.log(data);
        }

        function beforeSubmit(){
        }

        function OnProgress(event, position, total, percentComplete)
        {
            //Progress bar
        }

        function bytesToSize(bytes) {
            var sizes = ['Bytes', 'KB', 'MB', 'GB', 'TB'];
            if (bytes == 0) return '0 Bytes';
            var i = parseInt(Math.floor(Math.log(bytes) / Math.log(1024)));
            return Math.round(bytes / Math.pow(1024, i), 2) + ' ' + sizes[i];
        }
    });
}); 

PHP

if (isset($_POST['submit_btn'])&& $_POST['submit_btn']== 'reg') {
    $data = array();
    $errors = array();

    $email=trim($_POST['email']);
    $pass=trim($_POST['pass']);
    $pass2=trim($_POST['pass2']);

    if (!filter_var($email, FILTER_VALIDATE_EMAIL)) {
        $errors['email']="Invalid email";
    }

    if (empty($pass) || empty($pass2)) {
        $errors['pass']="Invalid passwords";
    }

    if (strcmp($pass, $pass2)) {
        $errors['pass']="Invalid passwords";
    }

    if (empty($errors)) {
        $add_user= add_new_user($conn,$email,$pass);
    }

    if ($add_user) {
        $data['success'] = true;
    } else {
        $data['success'] = false;
    }

    echo json_encode($data);
}
1

There are 1 answers

0
allpnay On

Well, I found the problem. Receiving data in PHP I check if I SUBMIT button is pressed and the VALUE his. AJAX does not send button, so I added a HIDDEN field and checks to see if I got the right form. Thank you all

<form class="uk-form" id="register_frm" action="php/register.php" method="POST" enctype="multipart/form-data">
<input type="email" name="email" id="email" class="uk-width-1-1 uk-form-large" value="[email protected]">
<input value="111" type="password" name="pass" id="pass" class="uk-width-1-1 uk-form-large" >
<input value="111" type="password" name="pass2" id="pass2" class="uk-width-1-1 uk-form-large">
<input type="hidden" name="reg" id="reg">
<button class="uk-button uk-button-primary uk-button-large uk-align-center" type="submit" name="submit_btn" id="submit_btn" value="reg">Register <i class="uk-icon uk-icon-spin uk-icon-spinner" id="output"></i></button>
<div id="output"></div>

PHP

if (isset($_POST['reg'])) {}