Can you help me with this ajax update notifications scenario

Question

I'm working with Laravel 9 to develop a forum project, and I have used database notifications for showing users new notifications such as best answer or etc.

The notifications list works correctly but shows the number of new notifications after the page refreshes. But I need to apply the ajax live update to get real-time applications user experience. So here is the notification-header part, which shows the number of new notifications:

<div class="header__notification-btn" data-dropdown-btn="notification">
    <i class="icon-Notification"></i>
    @if(count(auth()->user()->unreadNotifications) != 0)
        <span id="unreads">{{ digits_persian(count(auth()->user()->unreadNotifications)) }}</span>
    @endif
    <span style="display:none" id="elan"></span>
</div>

Then I tried applying the Ajax part like this:

        notifcount = 0;
        $(document).ready(function() {
            setInterval(function() {
                $.ajax({
                    url: 'new-notifications-exists',
                    method: 'GET',
                    dataType: 'json',
                    success: function(response) {
                        if(notifcount == 0){
                            notifcount = response.notifcount;
                        }
                        if(response.notifcount > notifcount){
                            notifcount = response.notifcount;
                            new_notifications_found();
                        }
                    }
                });
            }, 2000);
        });
        function new_notifications_found(){
            $("#unreads").hide();
            $("#elan").show();
            $("#elan").html("+.");
        }

And this is the new-notifications-exists URI handler:

Route::get('/new-notifications-exists', 'ToolsController@count_notifz');

Controller Method:

public function count_notifz()
    {
        if(Auth::check()){
            $notiflist = DB::table('notifications')->where('notifiable_id',auth()->user()->id)->whereNull('read_at')->get();
            $notifcount = $notiflist->count();
            $response = array('notifcount' => $notifcount);
            echo json_encode($response);
        }
    }

So: When I get a new notification, the <span style="display:none" id="elan"></span> must be appeared because of the js function new_question_found() which eventually hide #unreads and show #elan div instead.

But this thing does not work, and I get this error at the Console:

"No query results for model [App\Models\Question] new-notifications-exists"**

I don't know really what's going wrong here.

So if you have any idea about this or know how to apply ajax properly for these notifications, please let me know...

I would appreciate that.

Try to debug your backend code. i.e : you can do `dd` in your laravel code check what query is printing . Check what `$notiflist` has . — Swati, Mar 07 '23 at 04:36
From your error message I think you have used Quetion model some where that may have some issues , check once if you have Quetion model in App\Models directory — Sagar Sainkar, Mar 07 '23 at 09:40
There should be something wrong with your routes, look at this question https://stackoverflow.com/questions/68672766/laravel-route-issue-no-query-results-for-model — lyz, Mar 13 '23 at 06:59

Alijvhr · Accepted Answer · 2023-03-09T12:53:00.863

Simply change controller method to this:

public function count_notifz()
    {
        if(Auth::check()){
            $notifcount = count(auth()->user()->unreadNotifications);
            return response()->json(['notifcount' => $notifcount]);
        }
    }

It works in your header blade then should work everywhere else.

And please put a slash at the beginning of you ajax URL:

url: '/new-notifications-exists'

Also there is a problem with your ajax:

if(notifcount == 0){
    notifcount = response.notifcount;
}

If you assign response.notifcount to notifcount then next if will never be true! therefore the new_notifications_found() never executes.

So just simply remove it. The logic will be intact.

$.ajax({
    url: '/new-notifications-exists',
    method: 'GET',
    dataType: 'json',
    success: function(response) {
        if(response.notifcount > notifcount){
            notifcount = response.notifcount;
            new_notifications_found();
        }
    }
});

score -1 · Answer 2 · answered Mar 07 '23 at 11:53

Not sure this will help but this happened to me. The issue is with the route may be. Because error says NotFoundException

Change this

Route::get('/new-notifications-exists', 'ToolsController@count_notifz');

to this

Route::get('/new-notifications-exists', [ToolsController::class, 'count_notifz']);

Import your ToolsController in route. use App\Http\Controllers\ToolsController;. (id default path)

And run

PHP artisan optimize

And use return response()->json($response); instead of echo

Can you help me with this ajax update notifications scenario

"No query results for model [App\Models\Question] new-notifications-exists"**

2 Answers2