jquery function is not called when clicking on link

Asked Jul 04 '17 at 15:25

Active Jul 04 '17 at 16:16

Viewed 148 times

I am trying to call a jquery function when clicking on a link, but it doesn't work, the function is not called at all...

Function:

<script>
    $(document).ready(function () {

        $('#notif').click(function () {
            var id = $(this).attr("data-id");
                        alert('test');
            $.ajax({
                type: "POST",
                url: "inc/showNotif.php",
                dataType: "html",
                data: {
                    id: id
                },
                success: function (result) {
                    $('.displayNotif').html(result);
                    console.log(result)
                }
            });

        });
    });
    </script>

Link:

<a href="#" id="notif" data-id="<?php echo $_SESSION['ID']; ?>" class="dropdown-toggle" data-toggle="dropdown">
                            <i class="icon-bell2"></i>
                            <span class="visible-xs-inline-block position-right">Activity</span>
                            <span class="status-mark border-orange-400"></span>
                        </a>

EDIT

I discovered that the code between tags doesn't execute at all, not even if I remove the onclick event.

EDIT 2

The issue is $(document).ready(function () the code works without it, but why?

SOLVED

Issue was some jquery errors preventing document.rady

edited Jul 04 '17 at 16:16

asked Jul 04 '17 at 15:25

Crackengous

Hello I think [this](https://stackoverflow.com/questions/8908191/use-jquery-click-to-handle-anchor-onclick) can help you !! – Ray Lloy Jul 04 '17 at 15:27
just remove href="#" or stop event propagation – enno.void Jul 04 '17 at 15:28
you could also replace your `href="#"` for `href="javascript:void(0);"` – Nicolas Jul 04 '17 at 15:28
@Nicolas I did what you've said and the jquery function is still not being called, I don't think the href is the issue because it used to work :/ something else must be but I can't see it – Crackengous Jul 04 '17 at 15:32
Question: are you adding your `` after the page has loaded? In the doc ready, (before the click handler) add: `alert($('#notif').length)` - what value do you get? What about `alert($("[id=notif]").length)` – freedomn-m Jul 04 '17 at 15:43
I believe you have multiple hyperlinks with id `notif`, If so then change id to class in js and html – Mahesh Singh Chouhan Jul 04 '17 at 15:45
Nothing... strange.. looks like the code between – Crackengous Jul 04 '17 at 15:45
Where are you defining the ` – freedomn-m Jul 04 '17 at 15:49
@freedomn-m at the bottom of my php file before – Crackengous Jul 04 '17 at 15:50
Try: `` - are you also checking the console for errors? – freedomn-m Jul 04 '17 at 15:51
... worth checking, sometimes people put ` – freedomn-m Jul 04 '17 at 15:51
@freedomn-m that worked, so `$(document).ready(function () {` this is the issue – Crackengous Jul 04 '17 at 15:54
Ok, so try: `alert($)` - maybe you haven't included jquery before your script? – freedomn-m Jul 04 '17 at 16:06
I got `function (a,b) {return new ` or something like that @freedomn-m – Crackengous Jul 04 '17 at 16:08
$ isn't always jquery - do you get the same with `alert(jQuery)` ? (most likely the same) - and the jquery include is definitely before your ` – freedomn-m Jul 04 '17 at 16:10
Otherwise not sure I can help beyond that. – freedomn-m Jul 04 '17 at 16:11
@freedomn-m I had some errors in other jquery files that were preventing document.ready, I fixed it, thank you alot, if you post as a comment I'll mark it as solved – Crackengous Jul 04 '17 at 16:15
Glad you got it to work. – freedomn-m Jul 04 '17 at 16:17

jquery function is not called when clicking on link

EDIT

EDIT 2

SOLVED

0 Answers0