A metabox is part of a website whose contents can be drawn from an AJAX call and get refreshed anytime or using an interval.
JavaScript PHP CSS
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Failed to load latest commit information.


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.


Added custom css, header and footer support.

Added begin/end support to render initial content.

##Update guide

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


Tested on Yii 1.1.12


Simple initialisation:

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

This prints:

<div id="mymetabox" class="metabox">
  <div class="metabox-content"></div>


$('#mymetabox').metabox({url : 'myurl'});

You can refresh it manually, using JavaScript, without parameters


or with extra parameters

$('#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';

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 callcing 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


Unzip into the extensions folder.