0

There are many Form and Link related examples for D7's new Ajax features. I'm looking for something a little less involved but haven't got it working yet.

Using ajax-reload-of-block-on-an-event

I've modeled the following contrived example:

I'm tring to request and receive a tag and then nest it within an existing one:

function MY_MOD_menu(){
    $items['ajax/insert'] = array(
            'page callback' => 'ajax_return_tag',
            'type' => MENU_CALLBACK,
            'access callback' => TRUE,
    );
    return $items;
}

function ajax_return_tag(){
    $tag = "<h1>";
    $tag .= "HERE";
    $tag .= "</h1>\n";
    return $tag;
}

Here is the js:

(attach:function ($) {Drupal.behaviors.MY_MOD = {function (context){
    var insert = function(response){
            $('.field-name-field-').html(response);
    };      
    $.post('/q=ajax/insert',
            {},
            insert,
            'html',
    );

}};})(jQuery);

It does not appear that my event is firing. Do I need to do something in addition to get the js to load on document ready? Have I made a mistake with the way I've attached the behavior?

Thanks in advance.

EDIT: Thank's for the responses. The typos are a result of me creating this example on the spot. I'm not so interested in getting this specific example to run but I am interested in a example that will update/Insert a DOM element that is not a Form or Link.

FYI I don't believe the event is firing. I assume that means that it is not registered with D7's included jQuery?

  • Where is the JS being inserted? I didn't think about that portion before, but I see no drupal_add_js, so where exactly is this JS being written? – Charlie Schliesser Jan 20 '12 at 20:34
  • The js is being inserted via hook_node_view_alter. I've confirmed that the js is in the resulting node page; however, I don't believe the event is firing. I'll see if I can't clean this question up this eve as I think it is more confusing then need be. – SMTF Jan 20 '12 at 20:53
3

First visit example.com/ajax/insert to verify your content is being printed out.

Your overall JS structure looks odd, plus you have a lot of typos. This .field-name-field- is probably not a real class since it ends in a trailing dash. /q= is not a HTTP query, you probably want /?q=.

Try this:

(function ($) {

  Drupal.behaviors.my_mod = {
    attach: function (context, settings) {

      $.ajax({
        type: 'GET',
        url: Drupal.settings.basePath + '?q=ajax/insert',
        dataType: 'html',
        success: function(response) {
          $('.field-my-field-class').html(response.data);
        }
      });

    }
  };

})(jQuery);
  • I agree that the js structure is odd. I was modeling it off of this excepted answer: drupal.stackexchange.com/a/11633/1563 – SMTF Jan 20 '12 at 20:56
  • I'm getting an alert on load using your above example. That solves the event firing. – SMTF Jan 21 '12 at 0:04
2

It's not clear to me whether the event is firing or not. If it isn't, that's another problem in addition to the points Charlie S pointed out.

Consider adding some other reliable instruction like an alert, to be executed on the event. This will help you narrow down, when your expected Drupal behavior fails, whether it's because of the event failing ot fire or another reason.

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.