2

I want to change the delete link on comments so that the delete confirmation is returned with Ajax and then the delete confirmation is executed with Ajax.

I have fixed the form so the delete confirmation at /comment/%cid/delete so now the submit action is performed with ajax.

Here is the code I used to accomplish this:

function awesomesite_comments_form_comment_confirm_delete_alter(&$form, &$form_state, $form_id) {

  // Add the Ajax Submit Function
  $form['actions']['submit']['#ajax'] = array(
    'callback' => 'awesomesite_comments_ajax_delete',
    'progress' => false,
  );

}

function awesomesite_comments_ajax_delete($form, $form_state) {

  // Get rid of all of the messages that have been set
  drupal_get_messages();

  // Get the comment & node objects
  $comment = $form_state['comment'];

  // Put all of the Ajax Commands into an array
  $commands = array();

  // Place the comment above the form
  $commands[] = ajax_command_remove('#comment-'.$comment->cid.', comment-'.$comment->cid.' + .comment');

  // Return the Ajax Commands Array
  return array('#type' => 'ajax', '#commands' => $commands);

 }

This works perfectly on the delete confirmation page, however, when I return the form with Ajax, the submit no longer is processed with Ajax and a standard page refresh takes place.

Here is the PHP code I have to for delivering the confirmation form via Ajax:

function awesomesite_comments_menu_alter(&$items) {
  $items['comment/%/delete/ajax'] = $items['comment/%/delete'];
  $items['comment/%/delete/ajax']['delivery callback'] = 'ajax_deliver';
  $items['comment/%/delete/ajax']['page callback'] = 'awesomesite_comments_ajax_confirm_delete_page';
}

function awesomesite_comments_ajax_confirm_delete_page($cid) {

  // Get the HTML of the detele page.
  $data = drupal_render(comment_confirm_delete_page($cid));

  // Put all of the Ajax Commands into an array
  $commands = array();

  // Replace the HTML
  $commands[] = ajax_command_html('#comment-'.$cid.' + .comment', $data, array('effect' => 'fade'));

  return array('#type' => 'ajax', '#commands' => $commands);

}

And here is the Javascript I have for taking the "Delete" link on the comments and returning the form (from the callback above)

jQuery('a.ajax-link:not(.ajax-processed)').addClass('ajax-processed').each(function() {

        // Cret the element settings object
        var element_settings = {};

        // Get rid of the progress
        element_settings.progress = { 'type' : 'none' };

        // setup the click elements and add the href
        if (jQuery(this).attr('href')) {
            element_settings.url = jQuery(this).attr('href');
            element_settings.event = 'click';
        }

        element_settings.effect = 'fade';

        // Get the base
        var base = jQuery(this).attr('id');

        // Register the Ajax Request with Drupal
        Drupal.ajax[base] = new Drupal.ajax(base, this, element_settings);

    });

I believe what is happening is that Drupal is processing all the forms on the page for #ajax when the page is loaded, however, since the form is loaded via AJAX it isn't setting up the #ajax information (which I can confirm is present). How can you force Drupal to check for new forms after an Ajax request? Or am I missing something?

any help would be greatly appreciated!

5

I found the answer!

I simply was asking the wrong question. What I needed to do was re-attach the drupal behaviors with Drupal.attachBehaviors().

I added this code to my JavaScript code.

jQuery('.ajax-processed').once().ajaxSuccess(function() {
    Drupal.attachBehaviors();
});

Voilà! Everything works as it should.

0

To make things a bit more clear, for beginners like me, use it in this way:

(function($)  {

    $(document).ready(function(){

        ..the JS code here..

    });

jQuery('.ajax-processed').once().ajaxSuccess(function() {
    Drupal.attachBehaviors();
});

})(jQuery);

Clive and David, thank you SO much

0

I'd built a number of ajax forms before running into a problem like this, it was strange some ajax worked and other parts just didn't.

The answer I discovered after digging deep into ajax.js and the data structures returned by ajax calls was that ajax.js seemed to be dependent on one of two conditions. Either your fapi ['#ajax'] enabled elements must be without any 'id' information, or they must provide both a fapi ['#id'] and a fapi ['#attributes']['id'].

Hopefully, for anyone running into this type of problem, can add this to the checklist to be sure.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.