CODEWITHSUNDEEP
phpjqueryjsoncallback
Igal
Igal

Reputation: 6083

jQuery callback function not executed

I have a contact form with a few input fields and a div that acts as a button - when I click on it, it calls for a function that validates the form and if everything is OK it submits it. The function sends the data from the inputs to a API.php file, which calls for a sending function in the BusinessLogic.php file. Once the form is submitted - a callback function should be activated and it should animate a confirmation div.

The HTML of the inputs:

<div id="contact_inputs_block">
    <div class="div_contact_form_input_box div_input_name">
        <input type="text" name="Name" placeholder="* Name" id="name">
    </div>
    <div class="div_contact_form_input_box div_input_phone">
        <input type="tel" name="Phone" placeholder="* Phone" id="phone">
    </div>
    <div class="div_contact_form_input_box div_input_email">
        <input type="email" name="Email" placeholder="* Email" id="email">
    </div>
</div>
<div class="form_confirmation_wraper">
    <div id="div_form_confirmation">
        Message sent.
    </div>
    <div class="div_send_form">

    </div>
</div>

Here's my function:

function submit_form(language)
{   

var email_str = $("#email").val();
var errors = new Array();

$("#contact_inputs_block>div:not(:last-child)").css({'border-color' : '#a5957e', 'background-color' : '#f8f8f8'});


if ($("#name").val()=="")
{
    errors.push(".div_input_name");
}
if(!validate_email(email_str))
{
    errors.push(".div_input_email");
}
if ($("#phone").val()=="")
{
    errors.push(".div_input_phone");
}


if (errors.length == 0)
{


    $.getJSON("inc/API.php",
    {
        command : "send_contact_form",
        name : $("#name").val(),
        email : email_str,
        phone : $("#phone").val(),
        message : $("#message").val().replace(/\n/g, '<br>'),
        form_language: language
    } ,function(){
        alert("sent");
        $("#div_form_confirmation").animate({opacity:1}, 1000, function(){
            setTimeout($("#div_form_confirmation").animate({opacity:0}, 3000, function(){location.reload()}),6000);
        }); // end callback function
    }); // end getJSON
} // end if
else
{
    for (var i = 0; i <= errors.length; i++)
    {
        $(errors[i]).css({'border-color' : '#E60005', 'background-color' : '#ffc4c9'});
    }
}
}

this is the function in API.php:

include_once 'BusinessLogic.php';
session_start();

$command = $_REQUEST["command"];

switch($command)
{
    case "send_contact_form" :
        send_contact_form($_REQUEST["name"], $_REQUEST["email"], 
            $_REQUEST["phone"], $_REQUEST["message"], $_REQUEST["form_language"]);
        break;
}

and the BusinessLogic.php actually sends the mail.

The mail is being sent, everything is OK there. The problem is the callback of submit_form() function is never fired and I don't see the confirmation that the mail was sent.

Why is it happening and how do I fix it? Thanks!

Upvotes: 0

Views: 65

Answers (1)

jvicab
jvicab

Reputation: 286

A different approach could be using $.post instead of $.getJSON (everything else will remain the same). It will make the desired ajax call. Parameters defined will be in $_POST array ($_REQUEST is fine)

Upvotes: 2

Related Questions