My problem: I'm trying to open some node edit links within a modal - which normally I can do fine (done it tons of times), the twist here is that the node edit links are generated using jquery when a user clicks on an item on the page (well when a user clicks on an item, an ajax request is made that if successful, populates 2 blocks on the page. 1 block is populated with draggable items, the other is populated with node edit links).

Clicking on any of the generated node edit links gives a dump of the code that should be used to generate the modal.
Now on the same page I have other content that is not dynamic that also generates a modal and if I open one of those modals first, my node edit modals work just fine.
I figured out that Drupal.CTools.Modal.clickAjaxLink is what works in the other case, but the conditions don't seem to be quite right in my case for that to work. I.e when the links are clicked, there is no other ajax request, in the working instance, the ajax request is made on click, so Drupal.CTools.Modal.clickAjaxLink can be bound that. I tried just calling Drupal.CTools.Modal.clickAjaxLink on click, but all that does is create a modal which disappears once the code is dumped to screen as before.
Any ideas on the best approach? (My initial thoughts are to just make the click into another ajax request which would allow me to bind Drupal.CTools.Modal.clickAjaxLink as in the other case, but is there something simpler I'm missing?)

Comments

zahor’s picture

Assigned: Unassigned » zahor
Status: Active » Closed (fixed)

I resolved this by following my hunch and adding an ajax request to the click event of the link I added..well it's better explained with code for anyone else who might have a similar problem:
(Note this is Jquery).

 $("link_I_want_to_target").click(function(e) {
   //Stop the default behavior from happening
    e.preventDefault();
    //Drupal.ajax definition: Drupal.ajax = function (base, element, element_settings) {
   //So I just choose the parent of the link as my "element"
    var ajax = new Drupal.ajax('main', 'link_I_want_to_target's parent', {
    event: 'my_madeup_event_name',
    url: this.href, //the ajax url is the same as it was before
    submit: function(e, xhr, settings) {
      nodelink: this.href 
    /* this would have been relevant if I wanted to do something on the drupal end with POST variable(s), 
     * but I don't. Would have made a $_POST['nodelink'] var available, left for someone that 
     * might be able to use  it. You can add multiple
     */
    },
  });
  $(ajax.element).bind('my_madeup_event_name', Drupal.CTools.Modal.clickAjaxLink)
    .trigger('my_madeup_event_name');
});

And voila, clicking my ajax generated link opens up in a modal.

Well, not quite. I found that after my modal was closed, I still had the ajax-progress going on my links, so to fix that (and someone can correct me if I did this the wrong way), I added this code:

$(document).bind('CToolsDetachBehaviors', function(modal) {
  $("parent_item_of_links div.ajax-progress").remove();
});