Just relesed the Fancybox extension.
Just relesed the Fancybox extension.
would you please describe how to use it.
i add these on my view page, but nothing appear
<div style="display:none"><div id="data">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</div></div>
<?php $this->widget('application.extensions.fancybox.CFancyBox', array(
'target'=>'data',
'config'=>array(
'scrolling' => 'no',
'titleShow' => false,
),
)
);
?>
what should ‘target’ refer to?
solved
<?php echo CHtml::link("tes","#data", array('id'=>'inline')); ?>
<div style="display:none"><div id="data">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</div></div>
<?php $this->widget('application.extensions.fancybox.CFancyBox', array(
'target'=>'a#inline',
'config'=>array(
'scrolling' => 'yes',
'titleShow' => true,
),
)
);
?>
Yes you need a link to fancybox work.
Thanks for making this extension. I’m having a problem where I can’t configure any of the event keys for the extension (onStart, onCancel, etc). The problem occurs when I try and place a function within a value for the configuration. For example, in my configuration array I have:
‘config’ => array(
'onStart'=>"function(){console.log('it works'');}",
'onClosed'=>"function(){alert('it closes');}"
),
However, when Yii generates the script it comes out as:
{
‘onStart’:‘function(){console.log(\‘it works\’\’);}’,
‘onClosed’:‘function(){alert(\‘it works\’);}’
});
It seems as if Yii is putting quote marks around the function. Is there anyway around this?
Thanks for your help.
Yes dude. I got this issue on one of my projects…
Try use ‘js:…’ at the beginning of the functions like folow
‘onStart’:‘js:function(){console.log(\‘it works\’\’);}’,
‘onClosed’:‘js:function(){alert(\‘it works\’);}’
Thanks a lot. Your solution worked like a charm.
Thanks. I’m glad that this work properly.
I want to close fancybox from other element. I wonder why the $.fancybox.close() doesn’t take any effect? The error said “$.fancybox is undefined”. Do you know why?
Could you post your code?
This is the view where I put the fancybox
<script type="text/javascript">
<?php
/*
* The javascript for calling ajax
*
*/
echo CHtml::ajax(array('update'=>'#dialog_ground', 'url'=>Yii::app()->createUrl('/Barang/cari',
array('inputField'=>'MutasiBarangDet_barang_id'))));
?>
</script>
<div class="row">
<?php echo $form->textField($model,'barang_id'); ?>
<?php echo CHtml::link('Pilih Barang','#dialog_ground',array('id'=>'tampilbarang')); ?>
<div class="hidden"><div id="dialog_ground" ></div></div>
</div>
<?php $this->widget('application.extensions.fancybox.CFancyBox', array(
'target'=>'a#tampilbarang',
'config'=>array(
'scrolling'=> 'yes',
),
)
);?>
This is the ajax page that I called, it’s view
<?php
$dp = $model->search();
$dp->keyAttribute='id';
$this->widget('zii.widgets.grid.CGridView', array(
'id'=>'barang-grid',
'dataProvider'=>$dp,
'filter'=>$model,
'columns'=>array(
array(
'name'=>'id',
'value'=>'$data->id',
),
'nama',
),
));?>
<div class="row button" align="right">
<?php
/* Klik Ok! and it will close the fancybox */
echo CHtml::ajaxButton('Ok!','',
array('success'=>'js:function() {
var p_sel = $.fn.yiiGridView.getSelection("barang-grid");
if ( p_sel != "") {
$("#'.$inputField.'").val(p_sel);
$.fancybox.close(); //<--- I want to close at here. but it said "$.fancybox is undefined"
}
}'),array('id'=>'selectButton'));
?>
</div>
I’ve found the solution…
I need to put the widget to the ajax page become like this :
<?php $this->widget('application.extensions.fancybox.CFancyBox', array(
'target'=>'a#tampilbarang',
'config'=>array(
'scrolling'=> 'yes',
),
)
);?>
<?php
$dp = $model->search();
$dp->keyAttribute='id';
$this->widget('zii.widgets.grid.CGridView', array(
'id'=>'barang-grid',
'dataProvider'=>$dp,
'filter'=>$model,
'columns'=>array(
array(
'name'=>'id',
'value'=>'$data->id',
),
'nama',
),
));?>
<div class="row button" align="right">
<?php
/* Klik Ok! and it will close the fancybox */
echo CHtml::ajaxButton('Ok!','',
array('success'=>'js:function() {
var p_sel = $.fn.yiiGridView.getSelection("barang-grid");
if ( p_sel != "") {
$("#'.$inputField.'").val(p_sel);
$.fancybox.close();
}
}'),array('id'=>'selectButton'));
?>
</div>
By changing this, the fancybox is becomed recognized and it closed successfully
Thanks
I’m having a problem with 1.5. In IE the close and navigation graphics don’t show up. It is something with the paths with the AlphaImageLoader. I think it needs an absolute path but with the asset manager, I’m not sure how to do this. Does anyone have a fix?
has anyone been able to get fancybox to work after you render a page with ajax?
Using this extension i get the following javascript error;
"u is undefined"
Any ideas?
I’ve put the widget in the view getting rendered.
I’ve got the same problem.
The fancybox link:
<?=CHtml::link("jelentem", array('/report/create',
'sid'=>$comment->commentId,
'objtype'=>Report::OBJTYPE_CMT), array('id'=>'reportlink'))?>
<?php $this->widget('application.extensions.fancybox.EFancyBox', array(
'target'=>'a#reportlink',
'config'=>array(
'scrolling'=>'no',
'titleShow'=>true),
)
);
?>
fancybox content:
<?
...
$script=<<<EOD
$('#cancellink').click(function() {
$.fancybox.close();
});
EOD;
Yii::app()->clientScript->registerScript('fclose',$script);
?>
<a href="#" onClick="return false;" title="Close window" id="cancellink">mégsem</a>
If I click on cancellink I’ll get ‘$.fancybox is undefined’ error message
in order make $.fancybox be recognized, you must put the widget declaration in the same file with the $.fancybox.close().
Currently your closing fancybox code :
$.fancybox.close()
must be in different file with this code
<?php $this->widget('application.extensions.fancybox.EFancyBox', array(
'target'=>'a#reportlink',
'config'=>array(
'scrolling'=>'no',
'titleShow'=>true),
)
);
?>
isn’t it?
Hi there,
I have a hyperlink as a column value in zii.widgets.grid.CGridView which
has a class activated by fancybox. Works great but when you do a search through
CGridView the fancybox gets destroyed from the hyperlinks in the column value.
Do you know how I can reactivate fancybox after the search returns?
Cheers!
Spiro
create a new javascript function like this
function fancyboxRearm(target){
$(target).fancybox();
}
or
function fancyboxRearm(){
$(the target).fancybox();
}
on CGridView
afterAjaxUp //put the target selector…
remember to pass the config parameters again if you have setted on fancybox widget.
got it?
To close fancybox from a link inside an iframe:
parent.$.fancybox.close();
I am getting error when starting with multiple instance of fancybox. Do u have any suggestion please reply me.