Hello,
I am using YiiBooster extensions --> TbExtendedGridView --> The Grid/Chart switcher in my application.
So by default it displays the Grid view and we can select chart option too. Does anyone know how can I change it to chart as the default view when the page is loaded.
I was looking into TbExtendedGridView.php but did not find how to change that. I would really appreciate if you could help me on this.
Thanks.
may be you should do it with js ， the source code ：
TbExtendedGridView
// render switch buttons
$buttons = Yii::createComponent(
array(
'class' => 'bootstrap.widgets.TbButtonGroup',
'toggle' => 'radio',
'buttons' => array(
array(
'label' => Yii::t('zii', 'Grid'),
'url' => '#',
'htmlOptions' => array('class' => 'active ' . $this->getId() . '-grid-control grid')
),
array(
'label' => Yii::t('zii', 'Chart'),
'url' => '#',
'htmlOptions' => array('class' => $this->getId() . '-grid-control chart')
),
),
'htmlOptions' => array('style' => 'margin-bottom:5px')
)
);
echo '<div class="row">';
$buttons->init();
$buttons->run();
echo '</div>';
may be this works , not test :
<script type="text/javascript">
$(function(){
// use js code trigger the click event
$(".<yourGridId>-grid-control.chart").click();
});
....
Where do I have to add the js code.
My TbExtendedGridView.php:
// render switch buttons
$buttons = Yii::createComponent(array('class' => 'bootstrap.widgets.TbButtonGroup',
'toggle' => 'radio',
'buttons' => array(
array('label' => Yii::t('zii', 'Grid'), 'url' => '#', 'active' => true, 'htmlOptions' => array('class' => $this->getId() . '-grid-control grid')),
array('label' => Yii::t('zii', 'Chart'), 'url' => '#', 'htmlOptions' => array('class' => $this->getId() . '-grid-control chart')),
),
'htmlOptions' => array('style' => 'margin-bottom:5px')
));
echo '<div class="row">';
$buttons->init();
$buttons->run();
echo '</div>';
$chartId = preg_replace('[-\\ ?]', '_', 'exgvwChart' . $this->getId()); // cleaning out most possible characters invalid as javascript variable identifiers.
$this->componentsReadyScripts[] = '$(document).on("click",".' . $this->getId() . '-grid-control", function(){
var $parent = $(this).closest(\'[data-toggle="buttons-radio"]\');
var $otherButton = $parent.find(\'.active\');
$parent && $otherButton.removeClass(\'active\');
$(this).toggleClass(\'active\');
if($(this).hasClass("grid") && $("#' . $this->getId() . ' #' . $chartId . '").is(":visible"))
{
$("#' . $this->getId() . ' #' . $chartId . '").hide();
$("#' . $this->getId() . ' table.items").show();
}
if($(this).hasClass("chart") && $("#' . $this->getId() . ' table.items").is(":visible"))
{
$("#' . $this->getId() . ' table.items").hide();
$("#' . $this->getId() . ' #' . $chartId . '").show();
}
return false;
});';
// end switch buttons
// ****************************************
I think the change has to be done somewhere in
$this->componentsReadyScripts[]
But I am not sure how.
see registerScript
Yii::app()->clientScript->registerScript('chartSwitchOnReady','$(".<yourGridId>-grid-control.chart").click();' , CClientScript::POS_READY);
or just use the plain js code in your php view file
note my first post has some errors :
the css selector should be :
.<yourGridId>-grid-control.chart
I am trying this code in the index.php file
<script type="text/javascript">
$(function(){
// use js code trigger the click event
$(".yw0-grid-control.chart").click();
});
I am not getting any error and its not displaying the widget. I am really not sure about the grid id. I am taking it from the browser(chrome) view source. How can I get the exact id?
They have added this functionality in the extension on request.
, which is a flag used to set the chart as the default view of the widget
Thanks for all the help.