Django-notifications-hq How to live update notifications to read

Question

I've spent all day scouring a few versions of docs for this plugin, I've read through all of the tutorials I can find, and I went through every file in the repo to make note of all of it's parts. This ajax aspect is what I'm struggling with.

my example is essentially this getting started tutorial, I just customized the html output by overwriting the fill_notification_list javascript function: https://pypi.org/project/django-notifications-hq/

I have the notifications outputting into my template and have written a function for overwriting the default notifications javascript function. It's just a list of the notifications as text items. I want to mark all of the notifications "unread=False" when the alerts dropdown is clicked.

I know I'm supposed to ping a url on my app to set the notifications to read and then update the list using ajax.

I started with:

$('.sh-alert-btn').on('click touch', function(){
  $.get('{% url "notifications:mark_all_as_read" %}', function(response) {
    
  });
});

but I realized I don't know what to do at this point.

This is my custom fill_notification_list function:

function streamshiv_notify(data) {
  var menus = document.getElementsByClassName('live_notify_list');
  if (menus) {
      var messages = data.unread_list.map(function (item) {
          if(typeof item.verb !== 'undefined'){
              message = message + '<h6>' + item.verb + "</h6>";
          }
          if(typeof item.timestamp !== 'undefined'){
              message = message + '<p>' + new Date(item.timestamp).toLocaleDateString('en-US', {  
                day:   'numeric',
                month: 'short',
                year:  'numeric',
            }); + '</p>';
          }
          var unread = ((item.unread) ? 'unread' : 'read');
          return '<li class="' + unread + '">' + message + '</li>';
      }).join('')

      for (var i = 0; i < menus.length; i++){
          menus[i].innerHTML = messages;
      }
  }
}

I was going to mimic this with an onclick and after I mark the notifications to read, but I don't see the ajax request here, or in the package js file: https://github.com/django-notifications/django-notifications/blob/master/notifications/static/notifications/notify.js

The urls for the package are:

URLs:

{% url 'notifications:all' %}
{% url 'notifications:unread' %}
{% url 'notifications:mark_all_as_read' %} 
{% url 'notifications:mark_as_read' slug= %}
{% url 'notifications:mark_as_unread' slug= %}
{% url 'notifications:delete' slug= %}

api URLs:
{% url 'notifications:live_unread_notification_count' %}
{% url 'notifications:live_all_notification_count' %}
{% url 'notifications:live_unread_notification_list' %}
{% url 'notifications:live_all_notification_list' %}

How can I get my onclick function mark the notifications to read and refresh the list live?

Django-notifications-hq How to live update notifications to read

0 Answers0