While I using fancybox, I encounter a problem of passing function parameter form Widget to jQuery will not work with CJavaScript::encode().
This is javascript approach of passing parameters to a jQuery plugin, here we can directory passing function as parameter.
<script type="text/javascript">
$("a[rel=example_group]").fancybox({
'transitionIn' : 'none',
'transitionOut' : 'none',
'titlePosition' : 'over',
'titleFormat' : function(title, currentArray, currentIndex, currentOpts) {
return '<span id="fancybox-title-over">Image ' + (currentIndex + 1) + ' / ' + currentArray.length + (title.length ? ' ' + title : '') + '</span>';
}
});
</script>
When we write widget, we may wrap these JS code into as following code.
In run method, CJavaScript::encode() will 'Encodes a PHP variable into javascript representation.
class EFancyBox extends CWidget
{
...
public function run()
{
$config = CJavaScript::encode($this->config);
Yii::app()->clientScript->registerScript($this->getId(),"$('$this->target').fancybox($config);",CClientScript::POS_READY);
}
...
}
This is how I using the widget, notice that a passed a function in the array key/value pair.
And the function here will not be property encode to JavaScript variable.
<?php
$this->widget('application.widgets.EFancyBox', array(
'target'=>"a[rel=example_group]",
'config'=>array(
'transitionIn'=>'none',
'transitionOut'=>'none',
'titlePosition'=>'over',
'titleFormat'=>function($title, $currentArray, $currentIndex, $currentOpts){
return '<span id="fancybox-title-over">Image ' + ($currentIndex + 1) + ' / ' + $currentArray.length + ($title.length ? ' ' + $title : '') + '</span>';
}
)
));
?>
The above ‘config array’ will be pass to CJavaScript::encode() and below is the output.
{'transitionIn':'none','transitionOut':'none','titlePosition':'over','titleFormat':[]}
And what I expect shall be as follow.
{'transitionIn':'none','transitionOut':'none','titlePosition':'over','titleFormat':function(title, currentArray, currentIndex, currentOpts) {
return '<span id="fancybox-title-over">Image ' + (currentIndex + 1) + ' / ' + currentArray.length + (title.length ? ' ' + title : '') + '</span>';
}}
So, how shall I pass a function parameter in a widget config array~
With many many thanks for your help!