Question

I have 1 block:

<div class="going" filmid="2">
<a href="">I am going!</a>
<div>Going too: 20</div>
</div>

and 5 blocks:

<div class="going">
<a href="">I am going!</a>
<div>Going too: 20</div>
</div>

The difference in that one block have filmid attribute.
My js function:

function setUpUpdateGoingCount() {
            $("div.going a").click(function (e) {
                e.preventDefault();
                var filmId = $(this).parent("div").attr("filmid");
                $.post("/Cinema/UpdateGoingCount", { id: filmId }, function () {
                    alert("test");
                });
            });
        }

Click event work well with block without filmid atrribute.
Can you explain me why and how to do that first block works well?

Answer 1

Because filmid is not an attribute that exists in HTML, you should instead use a data attribute:

<div class="going" data-filmid="2">

You can access this with:

var filmId = $(this).parent("div").data("filmid");