El evento .click no funciona en jquery

I have following script in my page :

$(document).ready(function () {
    $('.RemoveLink').click(function () {

        //dialog box
        $('#dialog').dialog({
            autoOpen: false,
            width: 400,
            modal: true,
            resizable: false
        });

        //end dialog box


        var fileAddress = this.id;
        var parent=$(this).parent().parent();
         $('#dialog').dialog('open');

        $('#dialog').dialog({ /*Initialising a confirmation dialog box (with  cancel/OK button)*/
            buttons: {
                "delete": function () {
                    $(this).dialog('close');

                    $.ajax({

                        url: "url",
                        data: { id: fileAddress },
                        success: function (mydata) {
                        parent.hide();
                            //$('#FileThumbs .ImageFileItem[id=' + fileAddress + ']').hide();
                        },
                        type: "GET"
                    });
                },
                "cancle": function () { //if the User Clicks the button "cancel"
                    $(this).dialog('close');
                }
            }
        })
        return false;
    });
     $('.ResponseLink').click(function () {
        var idval = this.id;
        $.ajax({
            url: "url",
            data: { id: idval },
            dataType: 'html',
            success: function (mydata) {
                $("#ContactArea").empty().append(mydata);
            },
            type: "GET"
        });
        return false;
    });
});

as you can see I also use jquery ui dial box. when I click a link with 'RemoveLink' class it works properly and dialog pops-up, but after I click on a link with 'ResponseLink' class and then click on a link with 'RemoveLink', the page does not show dialog and link works as a normal link.

Would you please help me ?

Actualizado : I Am using asp.net mvc , and its partial views. I put some form in a partial view and used Ajax.BeignForm() method for form to send it asynchronously, but there is a point. To make validation work with Ajax.BeignForm() I should reference necessary scripts, even though I have referenced theme in a view that calls partial view. I removed those re-referenced scripts and now dialog appears again, but I lost client side validation on form!!!!!

preguntado el 27 de agosto de 11 a las 16:08

@ I cant understand what you mean ? -

Do you re-append HTML with a RemoveLink class in the ResponeLink response? -

There is a typo in your UI dialog, it says cancle instead of Cancel, but that's not the question here ;) -

no I dont re-append a RemoveLink class in ResponeLink. triggering causes #ContactArea begin updated and RemoveLink is in a table separated from #ContactArea -

Just for testing, what happen if you replace $('.RemoveLink').click( con $('.RemoveLink').live('click'? -

1 Respuestas

Utilizan .delegate en lugar de .click

$('#ContactArea').delegate('.RemoveLink', 'click', function (e) {...

In your case, you are attaching the click evento al .RemoveLink elements that were present at the time of attaching the click event handlers. Once you empty and clear out, those are replaced by new set of elements which don't have the event handler attached.

Usar .delegate will make sure that however the content inside #ContactsArea cambios, el .RemoveLink elements inside it will continue to be handled. Read more up on it in the docs.

Respondido 27 ago 11, 20:08

But .RemoveLink is not inside of #ContactsArea. - Babak Fakhriloo

Then probably something else is clearing them out. Or perhaps, do you see any error in the dev-tools/firebug console? - Shrikant Sharat

yes after triggering ResponeLink and then again clicking on RemoveLink, firebug shows an error but it disappears immediately- I made a brake point and saw that before reaching '$('#dialog').dialog({ ....' it throws an error but still cant see it. - Babak Fakhriloo

You can't see it because the page is getting reloaded. Click the Persist button in firebug console. You should be able to see the error. - Shrikant Sharat

it gives me this : $("#dialog").dialog is not a function [Break On This Error] $('#dialog').dialog('open'); - Babak Fakhriloo

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.