PHP + AJAX Form Submit Not Working

Question

I'm completely new to the concept of AJAX, but discovered that it's needed in order to accomplish what I'm setting out to do. Basically I just need need it to set the php variable $submitted equal to true whenever a post happens, which in turn runs a query to my database. For some reason, though this code makes sense to me, it doesn't seem like it's making it to the ajax file, even though I'm getting the "success" alert and I don't have console errors. Anything glaringly wrong?

<form action="call.php" method="post">
<input class="oomText" type="text" name="accountName" placeholder="Account Name"><br>
<input class="oomButton submit" type="submit" name="submit" value="submit">

<script>
$(document).ready(function(){
$('.oomButton.submit').click(function(){
    var clickBtnValue = $(this).val();
    var ajaxurl = '/ajax.php',
    data =  {'action': clickBtnValue};
    $.post(ajaxurl, data, function (response) {
        alert("Account Created");
    });
});

});
</script>
</form>

AJAX.PHP

<?php
if (isset($_POST['action'])) {
switch ($_POST['action']) {
    case 'submit':
        submit();
        break;
}
}

function submit() {
$submitted = true;
exit;
}

?>

you could echo something in your php file and then have your script alert that instead of "account created." that will test if the script is hitting that file. — Funk Doc, Apr 14 '16 at 15:22

score 0 · Answer 1 · answered Apr 14 '16 at 15:32

Try doing this:

Catch the form submit and make the POST via Ajax, and remove the action in form, you are pointing to call.php, so when you submit the form the action goes to call.php.

<form id="form" method="post">
<input class="oomText" type="text" name="accountName" placeholder="Account Name"><br>
<input class="oomButton submit" type="submit" name="submit" value="submit">

<script>
$(document).ready(function(){
  
$('#form').on('submit', function(e){
  
    var clickBtnValue = $('.oomButton .submit').val();
    var ajaxurl = 'http://clients.oomdo.com/provision/ajax.php',
    data =  {'action': clickBtnValue};
    $.post(ajaxurl, data, function (response) {
        alert("Account Created");
    });
});

});
</script>
</form>

Thanks for the response! Unfortunately, no luck. Still trying to do as much error checking as I can — codnor, Apr 14 '16 at 15:48

score 0 · Answer 2 · edited Apr 14 '16 at 16:01

Try using this code below.

When you succesfully fill out all fields of the form correctly and hit submit, it will prompt you with the js alert. PHP to js doesn't always need ajax thankfully. Notice how I've put my js in the php file. I just run the whole thing from the form call.

mail($toaddress, $subject, $message, $headers);
$success=htmlspecialchars($_GET['to']);
$success=ucwords($success);
$valid= 'sent to' . ' ' . $success . ' ' . 'from a php server. Hit the back arrow' ;
echo "<script type='text/javascript'>alert('$valid');</script>";

score 0 · Accepted Answer · edited May 23 '17 at 12:24

When you set a PHP variable, it will disappear as soon as the PHP script finishes. However, if you use PHP $_SESSION variable, it will persist.

To use the PHP $_SESSION variables, just add session_start() at very top of all PHP scripts. Note that session_start() must be the first instruction -- if any other PHP headers are sent, session_start() will not work.

Therefore, have your other PHP file also test the $_SESSION['submitted'] variable (again, session_start() is required up top) to ensure it is okay to run the DB insert.

HTML/JS:

<form action="call.php" method="post">
    <input class="oomText" type="text" name="accountName" placeholder="Account Name"><br>
    <input class="oomButton submit" type="submit" name="submit" value="submit">
</form>

<script>
    $(document).ready(function(){
        $('.oomButton.submit').click(function(){
            var clickBtnValue = $(this).val();
            var ajaxurl = 'http://clients.oomdo.com/provision/ajax.php',
            data =  {'action': clickBtnValue};
            $.post(ajaxurl, data, function (response) {
                alert(response);
            });
        });

    });
</script>

AJAX.PHP

<?php
    session_start();
    if (isset($_POST['action'])) {
        switch ($_POST['action']) {
            case 'submit':
                submit();
                echo 'Hurrah';
        }
    }

    function submit() {
        $_SESSION['submitted'] = true;
    }

?>

Here is a post with some helpful AJAX beginner info -- it links to another post containing some simple AJAX examples. Try them.

Prevent Page Load on Jquery Form Submit with None Display Button

Well... that did it!! I'm using tons of session variables already and didn't think the non-session variable would be reset like that. Thanks a bunch man! — codnor, Apr 14 '16 at 16:06

PHP + AJAX Form Submit Not Working

3 Answers3