Atk4 Step by Step form doesn't load Facebook Like Buttons

Question

I have a array with list of sites, I'm coding a step by step form using http://codepad.agiletoolkit.org/newsletter example.

In the second step I put Like Buttons using the following code:


    $attr = array (
      'data-send' => FALSE,
      'data-layout' => 'button_count',
      'data-width' => 100,
      'data-show-faces' => FALSE  
    );
    foreach($this->sites as $k => $site) {
      $div = $form->add('View_HtmlElement')->setElement('div')->set(NULL);  
      $attr['data-href'] = $site;  
      $div->addClass('fb-like');
      $div->setAttr($attr);
    }

This works good when I access directly, but when I try to access via next button, the Like Buttons doesn't load.

Any solution for this?

score 1 · Accepted Answer · answered Apr 18 '12 at 13:54

The reason why the facebook and some other buttons may not work with AJAX pages is because facebook scripts generally process your HTML only during initial load of the page. When the form in your example goes to next step, it uses AJAX to load additional form. As a result you will need to either manually trigger facebook's scripts to re-walk your page or perform redirects instead of reload. You would need to change:

$this->js()->atk4_load($this->api->getDestinationURL('./step2'))
    ->execute();

to

$this->js()->univ()->location($this->api->getDestinationURL('./step2'))
    ->execute();

You may also find this article useful: http://agiletoolkit.org/blog/adding-twitter-button-to-ajax-page/

Atk4 Step by Step form doesn't load Facebook Like Buttons

1 Answers1