php - Codeigniter 4 ajax post to controller method not working

Question

I know there are tons of similar questions but none seem to help so far.

So, I have AJAX POST within a QR code scanner function. The POST will send "string A" to CI4 controller and return back with "string B" to the view.

View (scan-attendance.php):

            qrcode.callback = (res) => {
                if (res) {
                    outputData.innerText = res;
                    console.log(res);

                    $.ajax({
                        url: '<?php echo base_url("pengran/absen") ?>',
                        type: 'post',
                        dataType: 'json',
                        data: {
                            res: res
                        },
                        success: function(data) {
                            console.log(data);
                        }
                    });
                }
            };

Routes (Routes.php):

$routes->group('pengran', function ($routes) {
    $routes->post('absen', 'OfficialController::verify_attendant');
});

Controller ('OfficialController')

class OfficialController extends BaseController
{
    public function verify_attendant()
    {
        d("#1");
        if ($this->request->isAJAX()) {
            $query = service('request')->getPost('res');
            d($this->request->getPost('res'));
        }
        d("#2");
        // doing some CRUD and getting some data from database... let's say, $result = "String B"
        $result = "String B";

        return view('pengran/scan-attendance', $result);
    }
}

I used to get 500 internal server error, but after fiddling with the code, now the error is gone but it seems verify_attendant() is never called. I never get "#1" in the browser console, let alone the CRUD and returning with "String B" back to the view.

Please help

question from:https://stackoverflow.com/questions/65902319/codeigniter-4-ajax-post-to-controller-method-not-working

Answer 1

If I'm reading all this correctly, I think you're expecting this AJAX call to refresh your page with a new view? It's not going to do that (at least not like this).

An AJAX call sends an HTTP request and in return expects some kind of response back from the server. If the request is deemed successful, it also expects some kind of data in return. The type of data it expects back is defined by dataType which here you've specified as JSON.

In your Controller method, you've returned a view which I'm going to guess is not in valid JSON format. The AJAX call is getting this data back, realizing it's not valid JSON and making the decision that the call in fact failed. Per JQuery's .ajax documentation:

The JSON data is parsed in a strict manner; any malformed JSON is rejected and a parse error is thrown.

Unfortunately you're blind to any kind of failure scenario right now as you never implemented the AJAX object's error option. You should always implement that in your AJAX calls to catch failures but again, that alone isn't going to fix the problem; I think there's a bigger misunderstanding here in regards to what AJAX does in general.