Hi,
First: There is an extension available at http://www.yiiframework.com/extension/bootstrap, but I never used it and it may not have any CForm support. If the extension can’t be used then it should work that way:
class BootstrapForm extends CForm
{
public $inputElementClass="BootstrapInputElement";
}
class BootstrapInputElement extends CFormInputElement
{
public static $coreTypes=array(
'text'=>'BStextField'
.....other elements here......
);
public $layout="<div>BOOTSTRAP ME<div class="foo">{{label}}</div><div class="bar">{{input}}</div></div>"; //specify how label, hint and input are rendered
//needs to be overridden to make use of BootstrapHtml instead of CHtml. Also take a look at renderLabel and renderHint for the same reason
public function renderInput()
{
if(isset(self::$coreTypes[$this->type]))
{
$method=self::$coreTypes[$this->type];
if(strpos($method,'List')!==false)
return BootstrapHtml::$method($this->getParent()->getModel(), $this->name, $this->items, $this->attributes);
else
return BootstrapHtml::$method($this->getParent()->getModel(), $this->name, $this->attributes);
}
else
{
$attributes=$this->attributes;
$attributes['model']=$this->getParent()->getModel();
$attributes['attribute']=$this->name;
ob_start();
$this->getParent()->getOwner()->widget($this->type, $attributes);
return ob_get_clean();
}
}
}
the placeholders (like {{label}}) will normally be rendered using a CHtml method (CHtml::label, CHtml::textField etc.).
The problems arise when you need a special formatting (like with checkboxlists etc) and the rendered CHtml element just doesn’t render like that and can’t be configured properly. Then you basically have two options: The not so elegant method is to override the render methods in your new BootstrapInputElement and create some logic the does that for you or you extend CHtml and create a BootstrapHtml class where you create methods for the needed elements like I did above in the renderInput() method. By using the coreTypes array in your new BootstrapInputElement class you actually map the type to the BootsrapHtml method.
class BootstrapHtml extends CHtml
{
public static function BStextField($name,$value='',$htmlOptions=array())
{
return '<div class="foo">'.CHtml::textField(($name,$value='',$htmlOptions=array()).'</div>';
}
}
So if you specify "text" as element type in your cform config it would create a new BStextField as you mapped it to the BStextField method.
'elements'=>array(
'username'=>array('type'=>'text', 'maxlength'=>80),
)
I know it looks really complex, but for the most part it is copy and paste. This might give you an idea
Hope it helps,
Hannes
P.S.: I know that a lot can be done using a view rendering each CForm element via $element->render() and taking care of the formatting in the view itself but as I mentioned: As CHtml is used to create each element you are never in full charge of how the created element itself will look like and the above method has one additional benefit: You can now use BootstrapHtml::BStext to render such an element wherever you want, even if you don’t use CForm