v1k45 / django-notify-x

Notification system for Django
MIT License
187 stars 40 forks source link

Delete , Mark read and Mark unread not working #37

Closed iostreanhs closed 7 years ago

iostreanhs commented 7 years ago

hi iam using notify-x to send notifications to a list of users this is how iam sending them user = User.objects.get(username = item['users']) notify.send(request.user, recipient=user, actor=request.user, verb='added', target=auctionitem, nf_type='default')

when i open the notifications/all url i can see the notifications but the mark all , delete and the other buttons for mark read unread isnt working. i have included the notifyx.js in my base.html like this

do i have to include something in my settings.py? please help

v1k45 commented 7 years ago

Are the requests for mark/delete notifications being sent when you click on the buttons? If not, then your html layout isn't set properly to work with the app.

The default templates are only supposed to be an example layout. You have to use certain classes specified in the Javascript file to bind them with AJAX callbacks to make sure it sends an AJAX request as soon as the button gets clicked.

iostreanhs commented 7 years ago

No requests are being sent. Where do i find these classes? and how to bind them? . Iam new to django if you could give me one small example or a reference it would be great. thank you.

v1k45 commented 7 years ago

The default setup should work.

The default config is listed on this page of documentation. The parent element which stores individual notification will use notifications class and the individual notification objects will have notification in their css class name. The same setup works on my project.

Make sure you have added {% include_notify_js_variables %} in your base template/ wherever you wish to use notifications.

If the buttons still don't work, please see if you get any errors in your browser console and post it here, then I'll be able to help you.

iostreanhs commented 7 years ago

Notity improperly configured. No data-nf-id was found.
Make sure you have a container element with 'undefined' as css class. Iam getting this error in my browser console

iostreanhs commented 7 years ago

and when i do {% include_notify_js_variables %} i get this error IOError at /inbox/all/ [Errno 13] Permission denied: u'C:\Users\asd\Desktop\dashbaord\git deployment\templates'

v1k45 commented 7 years ago

Sorry, I didn't test the library with windows. Can you check if your user has appropriate permission? Also, A full debug traceback will help too.

iostreanhs commented 7 years ago

this is the full traceback. What about the error in the browser console?
all.html already has {% include_notify_js_variables %} . when include this on default.html it gives the permission denied error and which users permission are you talking about?

v1k45 commented 7 years ago

What about the error in the browser console?

That error occurs when the script is not able to find css class names to work on. This classes are provided by the include_notify_js_variables templatetag.

all.html already has {% include_notify_js_variables %} .

No, it doesn't.

which users permission are you talking about?

The user you are using to run your django development server. Maybe try as administrator?

...

I'll give you the default output of that template tag so that you can try so that we can see if it works and if the PermissionDenied issue is caused by the templatetag.

v1k45 commented 7 years ago

@iostreanhs here is the default output by include_js_variables tempaltetag.

Make sure this in your base template.

    <script type="text/javascript">
        // Ajax-Notification related callback urls.
        var updateNotificationUrl = "/notifications/api/update/";
        var markNotificationUrl = "/notifications/mark/";
        var markAllNotificationUrl = "/notifications/mark-all/";
        var deleteNotificationUrl = "/notifications/delete/";

        // Jquery class selectors.
        var nfListClassSelector = ".notifications";
        var nfClassSelector = ".notification";
        var nfBoxListClassSelector = ".notification-container";
        var nfBoxClassSelector = ".notification-box";

        var markNotificationSelector = ".mark-notification";
        var markAllNotificationSelector = ".mark-all-notifications";
        var deleteNotificationSelector = ".delete-notification";

        var readNotificationClass = "read";
        var unreadNotificationClass = "unread";

        var notificationUpdateTimeInterval = "15000";

        //functions to handle ajax success.
        var updateSuccess = function (response) {
    var notification_box = $(nfBoxListClassSelector);
    var notifications = response.notifications;
    $.each(notifications, function (i, notification) {
        notification_box.prepend(notification.html);
    });
};

        var markSuccess = function (response, notification) {
    //console.log(response);
    if (response.action == 'read') {
        var mkClass = readNotificationClass;
        var rmClass = unreadNotificationClass;
        var action = 'unread';
    } else {
        mkClass = unreadNotificationClass;
        rmClass = readNotificationClass;
        action = 'read';
    }
    // console.log(notification.closest(nfClassSelector));
    notification.closest(nfSelector).removeClass(rmClass).addClass(mkClass);
    notification.attr('data-mark-action', action);

    toggle_text = notification.attr('data-toggle-text') || 'Mark as ' + action;
    notification.attr('data-toggle-text', notification.html());
    notification.html(toggle_text);
};

        var markAllSuccess = function (response) {
    //console.log(response);
    // console.log(response.action);
    if (response.action == 'read') {
        var mkClass = readNotificationClass;
        var rmClass = unreadNotificationClass;
    } else {
        mkClass = unreadNotificationClass;
        rmClass = readNotificationClass;
    }
    // console.log(mkClass);
    // console.log(rmClass);
    $(nfSelector).removeClass(rmClass).addClass(mkClass);
};

        var deleteSuccess = function (response, notification) {
    //console.log(response);
    var $selected_notification = notification.closest(nfClassSelector);
    $selected_notification.fadeOut(300, function () {
        $(this).remove()
    });
};
    </script>

let me know it works or you still see the error in the browser console.

iostreanhs commented 7 years ago

I included this script in my base.html and tried its still not working then i included this in default.html its still not working. its the same as it was before , do i have to do some changes in the settings.py or iam missing something? everything else is working the notifications are sent properly only the buttons are giving a problem. Iam able to perform the delete , unread, read, fuctions from the admin. The console is still giving me the error

notifyX.js:165 Notity improperly configured. No data-nf-id was found. notifyX.js:166 Make sure you have a container element with '.notification-container' as css class.

iostreanhs commented 7 years ago

extremely Sorry my bad i dint load the script properly now the console is giving me this error after i included the script in base.html in the console I am getting this error

jquery.min.js:4 GET http://localhost:8000/notifications/api/update/?flag=24 404 (Not Found)send @ jquery.min.js:4ajax @ jquery.min.js:4updateNotifications @ notifyX.js:170

jquery.min.js:4 GET http://localhost:8000/notifications/api/update/?flag=24 404 (Not Found)send @ jquery.min.js:4ajax @ jquery.min.js:4updateNotifications @ notifyX.js:170
jquery.min.js:4 GET http://localhost:8000/notifications/api/update/?flag=24 404 (Not Found)send @ jquery.min.js:4ajax @ jquery.min.js:4updateNotifications @ notifyX.js:170
iostreanhs commented 7 years ago

The page not found error was there because my url is inbox/ , and the url mentioned in the script is notifcations/. i changed it now my console is not giving any error but the buttons are not working.

v1k45 commented 7 years ago

i changed it now my console is not giving any error but the buttons are not working.

Can you see the requests in your browser's network tab? If you can see network calls to mark or delete urls, that means the buttons are working properly and the notifications are being marked as read successfully. But the js callbacks which are supposed to be ran after the request is completed didn't work properly.

iostreanhs commented 7 years ago

i opend the network tab and the network call is to http://localhost:8000/notifications/api/update/?flag=27 only. i cannot see mark or delete. The notification thing is kinda import part of my project and its urgent for me , can i have your phone number so that i can understand better and you could help me solve the problem?

here is my email id ashutosh@monimo.in

iostreanhs commented 7 years ago

Thank you for solving the issue. It was solved by placing the <script src="{% static 'notify/notifyX.js' %}"></script> at the bottom of my base.html.
also removed the <div class="notifications-container"> from my nf type html

v1k45 commented 7 years ago

Cool. Does the PermissionDenied error still persists?

iostreanhs commented 7 years ago

No it doesnt the problem was that i was writing it in a wrong way instead of{% include_notify_js_varibales %} i was writing {% include notifiy_js_varibales %} . I also forgot to include {% load notification_tags %}. So the right way of including it was {% load notification_tags %} {% include_notify_js_varibales %} <script src="{% static 'notify/notifyX.js' %}"></script>

At the bottom of my base.html

v1k45 commented 7 years ago

Okay. I am closing this issue because this was not a project issue. Feel free to reopen it.

Z-ephyr commented 5 years ago

Hello! I am experiencing exactly the same issue : the buttons do not work. When looking at the browser console I get the following error: Notity improperly configured. No data-nf-id was found. notifyX.js:166 Make sure you have a container element with '.notification-box-list' as css class.

At the bottom of my base_template.html I have included

  {% load staticfiles %}

  {% load notification_tags %}
  {% include_notify_js_variables %}
  <script src="{% static 'notify/notifyX.js' %}"></script>

  {% render_notifications using request.user.notifications.active for box %}

Could you please help me ? I read the whole thread but I did not manage to solve the problem...

@iostreanhs Could you please explain what you meant by i dint load the script properly : maybe I have the same problem than you do but I don't manage to understand how I could load the script properly

Z-ephyr commented 5 years ago

Ok I managed to solve the problem by adding the ul in my template


<ul class="notifications list-group">
    {% render_notifications using request.user.notifications.active for box %}
</ul>```
iostreanhs commented 5 years ago

Hi Zephyr sorry for the late reply. What I meant by I didn't load the script properly was, I had added the script at the top of my base.html which was causing problems. Glad that you were able to solve the problem on your own.

On Sun, 13 Jan 2019 at 18:13, Zéphyr notifications@github.com wrote:

Ok I managed to solve the problem by adding the ul in my template

    {% render_notifications using request.user.notifications.active for box %}
``` — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub , or mute the thread .
Z-ephyr commented 5 years ago

Thank you for your answer! I had also made this mistake at one point ^^