metabox Quickly setup ajax-delivered content into metaboxes.

  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.


Added custom css, header and footer support.

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


Tested on Yii 1.1.12


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';

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);}


With HTML response
With JSON response


Unzip into the extensions folder.



2 0
1 270 downloads
Yii Version: 1.1
License: BSD-2-Clause
Category: User Interface
Developed by: Fragoulas
Created on: Oct 9, 2012
Last updated: 10 years ago


show all

Related Extensions