Building your own Widget

Hi guys, I was a little surprised with the fact that the same markup was put into every admin view for the search hint and also for the advanced search as that meant that it was impossible to do change how it looks and feels in a single place. For example if you want the form to slide out rather than just open or if you want to add a little downward arrow to all the Advanced Search links you’d have to change every single admin view and that just sucks. So, I set out to widgetize those two things…

The SearchHint widget was quite easy, all I did was create a SearchHint which extended CWidget and called the render method on it passing the view file that I created. In the actual admin views I just replaced the same old markup with


The Advanced Search widget was a bit more complex. What I did is defined a gridViewId property on it, which is the Id of the grid view (as you need in the jquery script to update know which grid to update with ajax. Then I overrode the inti and run methods. THIS IS THE BIT I’M NOT SURE ABOUT… What I did was put ob_start() in the init method and $content = ob_get_clean() in the run. I then passed the $content into the $this->render which i called at the end of the run, after doing script registration.

In the admin view I now just call:

$this->beginWidget('AdvancedSearch', array('model'=>$model, 'gridViewId'=>'category-grid'));

$this->renderPartial('_search', array('model'=>$model));


This all seems to work, but I’m not 100% sure I’m grabbing what’s being inserted between beginWidget and endWidget in the correct way in the widget itself. I looked at the CPortlet widget and CBaseController when building this widget, so I’m pretty certain I’ve done it right, but still wanted to confirm with someone with a bit more experience creating Widgets if I’ve done this the right way. The basic question here is how do you grab the content between beginWidget and endWidget within the widget itself (if you want to decorate that content)? Can anyone who knows what they’re doing in this area confirm this.


As it says in the documentation -

So you have done it right…

Thanks I thought I did but wanted to check, there is little by way of example in the guide, I just looked at how CPortlet was implemented.