AJAX submit and 500 server error

Question

I get the 500 server error when trying to run my AJAX. I am very new to AJAX. Every thing works in the code if I run no AJAX in the script, for example just running:

$("#book-appointment-form").submit();

Therefore, it appears that all the database functions are fine. However, I need AJAX to run my code in a Wordpress page.

I do not see any notes in the error logs. The console log shows that the url is pointing to the correct location. What may I be missing?

The console log shows data within the hidden input showing up in confirmedData:

0: Object
name: "csrfToken"
value: "0f4343dfd0e71a8fa515d08f340f7bc9"
__proto__: Object
1: Object
name: "post_data"
value: "{"customer":{"last_name":"Test","first_name":"Joe","email":"email4me@verizon.net","phone_number":"9093334444","address":"","city":"","zip_code":"","id_cellcarrier":"2","wp_id":"1"},"appointment":{"start_datetime":"2015-12-25 11:00:00","end_datetime":"2015-12-25 11:50:00","notes":"","is_unavailable":false,"id_users_provider":"85","id_services":"13"},"manage_mode":false}"
__proto__: Object
length: 2
__proto__: Array[0]

VIEW:

<html>

                    <form id="book-appointment-form" style="display:inline-block" method="post">
                        <button id="book-appointment-submit" type="button">Confirm</button>
                        <input type="hidden" name="csrfToken" />
                        <input type="hidden" name="post_data" />
                    </form>
</html>

JS

<script>
                $("#book-appointment-form").submit(function(event){
                    var confirmedData = $(this).serializeArray();
                    var dataUrl = GlobalVariables.baseUrl + '/index.php/appointments/ajax_confirm_appointment'; 
                    $.post(dataUrl, confirmedData, function(response) {
                    ////////////////////////////////////////////////////////////
                    console.log('Customer Confirmed Post Response:', response);
                    ////////////////////////////////////////////////////////////
                    }, 'json');
                    event.preventDefault();
                });
                $("#book-appointment-form").submit();
</script>

PHP CONTROLLER

<?php
public function ajax_confirm_appointment() {
    if($_POST["post_data"]){
        try {
            $post_data = json_decode($_POST['post_data'], true);
            $appointment = $post_data['appointment'];
            $customer = $post_data['customer'];

            ...some database stuff here ....

        } catch(Exception $exc) {
            $view['exceptions'][] = $exc;
        }

        $this->load->view('appointments/book_success', $view);
        $form_data = TRUE;
         break;
        } else { 
        $form_data = FALSE;
        }
        echo json_encode($form_data);
    }
?>

I have tried replacing serializeArray() with serialize(). I have also tried serializeArray() converted with $.param(confirmedData)-- same results really and still it does not appear to reach the server. 500 error persists. I think serialize() may be the more appropriate one however.

Possible duplicate to question [jQuery Ajax to PHP MySQL - Cross Domain Internal Server Error 500](http://stackoverflow.com/questions/30545389/jquery-ajax-to-php-mysql-cross-domain-internal-server-erro-500). This might be helpful:[jQuery AJAX cross domain](http://stackoverflow.com/questions/3506208/jquery-ajax-cross-domain?rq=1) — Yogi, Dec 20 '15 at 08:40
Thanks, this is not a cross domain issue. All are run on my server on the same domain localhost. I am wondering about JSON and if serializeArray is sufficient or if I need to do more with the data to make it ready for transport. — Craig Tucker, Dec 20 '15 at 09:41

score 0 · Answer 1 · answered Dec 20 '15 at 08:18

0

I do not think it is related to Ajax. There may be problem in script that you are calling through ajax.

Try to check without ajax dataUrl

Please also check link . http://pcsupport.about.com/od/findbyerrormessage/a/500servererror.htm

answered Dec 20 '15 at 08:18

nitin jain

298
6
19

Yes it works without the AJAX. That is why I am posting this. And the Url is accurate. So, I am pretty sure I have screwed up the AJAX. I am not sure where I have messed up. – Craig Tucker Dec 20 '15 at 08:51
Can you try with another dataURL? It might work. Also I didn't find catch in your try catch block. Is it missing a closing '}'? – SanketR Dec 20 '15 at 08:56
Regarding the URL it appears to be working fine. When I run the URL in the browser I get the false response as it should. But, it is not sending that back with AJAX. So, although the data is serialized it may not be in the right format for the php side I am wondering. – Craig Tucker Dec 20 '15 at 09:45

score 0 · Accepted Answer · answered Dec 23 '15 at 09:24

This worked:

My JS

<script>
            $("#book-appointment-form").submit(function(event){
                    var postData = { 
                    csrfToken: $('input[name=csrfToken]').val(),
                    post_data: jQuery.parseJSON($('input[name="post_data"]').val())
                };
                var postUrl = GlobalVariables.baseUrl + '/index.php/appointments/ajax_confirm_appointment'; 
                $.post(postUrl, postData, function(response) {
                ////////////////////////////////////////////////////////////
                console.log('Customer Confirmed Post Response:', response);
                ////////////////////////////////////////////////////////////
                if (!GeneralFunctions.handleAjaxExceptions(response)) return;
                }, 'json');
            });
</script>

My CONTROLLER

<?php
public function ajax_confirm_appointment() {
    try {
        $post_data = $_POST['post_data'];
        $appointment = $post_data['appointment'];
        $customer = $post_data['customer'];

        ...some database stuff here ....

    }
    echo json_encode($yn_response);
}
?>

No more 500 server error.

AJAX submit and 500 server error

2 Answers2

Linked