1. Changelog
2. Update guide
3. Requirements
4. Usage
5. Examples
6. Installation
7. Resources

A metabox is simply part of the website, whose contents can be drawn from an AJAX call and get refreshed anytime or using an interval.

Changelog ¶

0.4
Added custom css, header and footer support.

0.3
Added begin/end support to render initial content.

Update guide ¶

From 0.2 to 0.4
PHP: Replace attribute initHtml with content
JS: Replace this.$element with this.$content in ajax callbacks

Requirements ¶

Tested on Yii 1.1.12

Usage ¶

Simple initialisation:

$this->widget('ext.metabox.EMetabox', array(
 'id' => 'mymetabox',
 'url' => array('/myurl'),
));

This prints: ~~~ [html]

~~~ and ~~~ [javascript] $('#mymetabox').metabox({url : 'myurl'}); ~~~

You can refresh it manually, using JavaScript, without parameters ~~~ [javascript] $('#mymetabox').metabox('refresh'); ~~~ or with extra parameters ~~~ [javascript] $('#mymetabox').metabox('refresh', { type: 'POST', data : { } }); ~~~

You can initialize it with an interval so that it auto-refreshes:

$this->widget('ext.metabox.EMetabox', array(
 'id' => 'mymetabox',
 'url' => array('/myurl'),
 'options' => array(
  'refreshInterval' => 1000, // refresh every second
 )
));

The metabox can have initial content. You can use the content attribute:

$this->widget('ext.metabox.EMetabox', array(
  ...
  'content' => 'Initial content'
));

or the begin/end:

$this->beginWidget('ext.metabox.EMetabox', array(
  ...
));
echo 'Initial content';
$this->endWidget();

You can optionally add a header and/or a footer to the metabox:

$this->widget('ext.metabox.EMetabox', array(
  'header' => 'My title',
  'footer' => date('H:i:s'),
  'content' => 'Initial content'
));

There are also three callbacks you can override which are called in the order shown below:

• beforeRefresh()
• handleResponse(response data)
• afterRefresh(response data)

Metabox::handleResponse by default updates the div's contents with the response data. Within the scope of these methods, this refers to the metabox object. You can access the outer div element by calling the $element attribute and the inner content div by calling the $content attribute as shown below in the example.
Also, you can access the header and footer divs (if they exist) by calling the $header and $footer attribute respectively.

$this->widget('ext.metabox.EMetabox', array(
 ...
 'options' => array(
  'handleResponse' => 'js:function(data){this.$content.html(data);}
 )
));

Examples ¶

With HTML response
With JSON response

Installation ¶

Unzip into the extensions folder.

Resources ¶

Github