Non action for added result in jQuery

Question

i have one hyperlink names it works fine and it has class "cancel-from-record-to-exam".

Please don't notice at the class name.

And the problem looks next: When i'm click on 'it works fine' it give me good result (change div in success action), but when i'm trying to click on the button, which has just appeared in div - then i can't see any action (nothing! even not alert('alert')) for this hyperlink. How can I resolve it?

<div id='loadingmessage' style=''>
    loading...
</div>

<a class="cancel-from-record-to-exam" data-id=19>it works fine</a>

@section Scripts {

    <script type="text/javascript">
        $("a.cancel-from-record-to-exam").click(function (event) {
            alert('alert');
            var requestForm = $('#loadingmessage');
                $.ajax({
                    url: '/Test/GetProducts',
                    contentType: 'application/html; charset=utf-8',
                    data: { id: $(this).data("id") },
                    type: 'GET',
                    dataType: 'html'
                })
                .success(function (result) {
                    alert('ok');
                    requestForm.html('<a class="cancel-from-record-to-exam" data-id=19>here's the new button and it doesn't any actions</a>');
                })
                .error(function (xhr, status, throwError) {
                    alert('bad');
                })
            });
    </script>
}

score 0 · Answer 1 · edited May 23 '17 at 12:13

The answer's here:

$(document).on('click', 'a.cancel-from-record-to-exam', function () {
    alert('hehe');
    var requestForm = $('#loadingmessage');
    $.ajax({
        url: '/Test/GetProducts',
        contentType: 'application/html; charset=utf-8',
        data: { id: $(this).data("id") },
        type: 'GET',
        dataType: 'html'
    })
    .success(function (result) {
        alert('ok');
        requestForm.html('<a class="cancel-from-record-to-exam" data-id=19>heheheheheh</a>');
    })
    .error(function (xhr, status, throwError) {
        alert('bad');
    })
});

I must to add:

$(document).on('click', 'a.cancel-from-record-to-exam' , function() {
     //code here ....
});

Here's the source: https://stackoverflow.com/a/12673849/3810460

Non action for added result in jQuery

1 Answers1