links do not open jquery dialog after a form save

setup: cakephp, jquery 1.8.7, cakephp.bee.pl ajax helper

I have a website who is set to load all pages through ajax. In the administration page I load the 'users/index' action and load the users. I have inserted a link to open a jquery dialog to add a new user. Once the admin clicks save it will send the data to the server, save the user and return the 'index' view back to update the administration page 'div'. Until now there are no problems. The problem is after the update the links in the newly updated div instead of opening a jquery dialog or delete the user and retun the index view through ajax they redirect the browser to the 'index' view but in new page and not loading it through ajax.

here is my dialog creation code:

<script type="text/javascript">
    $(document).ready(function(){
        $('a[name=modal]').click(function (e){
            e.preventDefault();
            var $link = $(this);
            var $form = $link.attr('formid');            
            // var $dv = $body.append('<div id="dlg"></div>');

        $('#useDlg').load($link.attr('href')).dialog({
         autoOpen: false,
         modal: true,
         title: $link.attr('title'),
         resizable: false,
         width: 370,
         height: 350,
         buttons: {
            "Close": function(){
                $(this).dialog("close");
                //$(this).dialog("destroy");
            },
            " Save ... ": function(){                
                $.ajax({
                    async: true,
                    type: 'POST',
                    url: $link.attr('href'),
                    data: $("form").serialize(),
                    dataType: "html",
                    success: function (response, json){
                        //alert(response);
                        $('#viewUsers').empty().html(response);
                        $('#useDlg').dialog("close");
                       // $('#useDlg').dialog("destroy");
                    }
                });
            }
         }
      });
   });
});

  $('a[name=modal]').click(function(){
       $('#useDlg').dialog('open'); 
    });

I am using the dialog multiple times to also edit the user profile. The user table has two links related to a user. View profile and Delete. The view profile opens the jquery dialog with the user profile and delete deletes the user and return through ajax the index action to update the users portion of the administration page.

does someone have any ideas why the links for view profile will not be catched after the users di开发者_运维技巧v has been refreshed?

thank you in advance, denis

---

It's difficult to tell exactly since you haven't posted your markup code, but I suspect what's happening is the 'click' handlers are being lost when you reload the form html in the load() call.

Try changing the 'click' handlers 'live' ones, which dynamically rebind. i.e. something like:

$("a[name=modal]").live("click", function(event) {
    // do stuff here...
});

See the docs for 'live' here: http://api.jquery.com/live/

---

thank you Mikesname...that did the trick...for anybody else who might encouter this issue I also removed the

$('a[name=modal]').click(function(){ $('#useDlg').dialog('open'); });

and only added the $('#useDlg').dialog('open'); to the first click event..without the second modification the event will still not trigger after reload and it will cause unforeseen results in page as well...

I would have set this as the answer but I really do not see how :)

regards, denis