I'm having an error with gridview update, sorting, paging. The grid is loaded fine via AJAX upon page load. But upon clicking the thead to sort the row, or upon clicking any of the pagination button I get an error saying:
Uncaught TypeError: Object [object Object] has no method 'popover'
jQuery.yiiGridView.afterAjaxUpdate
$.extend.success
fire
self.fireWith
done
callback
and in Firebug I'm getting:
TypeError: jQuery(...).popover is not a function
[Break On This Error]
jQuery('[data-toggle=popover]').popover();
This is pointing to this piece of code:
/*<![CDATA[*/
jQuery('#yw0').yiiGridView({'ajaxUpdate':['yw0'],'ajaxVar':'ajax','pagerClass':'pagination','loadingClass':'grid-view-loading','filterClass':'filters','tableClass':'tablehead table table-paper table-condensed table-striped table-sortable table','selectableRows':1,'enableHistory':false,'updateSelector':'{page}, {sort}','filterSelector':'{filter}','pageVar':'RealTime_page','afterAjaxUpdate':function() {
jQuery('.popover').remove();
jQuery('[data-toggle=popover]').popover();
jQuery('.tooltip').remove();
jQuery('[data-toggle=tooltip]').tooltip();
}});
/*]]>*/
I tried to solve the problem by including bootstrap.tooltip.js and bootstrap.popover.js additionally but I'm still getting the same error.
Here is the part where all the scripts are included:
<!-- start: JavaScript-->
<script src="<?php echo Yii::app()->theme->baseUrl;?>/js/jquery-1.10.2.js"></script>
<script src="<?php echo Yii::app()->theme->baseUrl;?>/js/jquery-migrate-1.0.0.min.js"></script>
<script src="<?php echo Yii::app()->theme->baseUrl;?>/js/bootstrap.min.js"></script>
<script src="<?php echo Yii::app()->theme->baseUrl;?>/js/bootstrap-tooltip.js"></script>
<script src="<?php echo Yii::app()->theme->baseUrl;?>/js/bootstrap-popover.js"></script>
<script src="<?php echo Yii::app()->theme->baseUrl;?>/js/jquery-ui-1.10.0.custom.min.js"></script>
<script src="<?php echo Yii::app()->theme->baseUrl;?>/js/jquery.ui.touch-punch.js"></script>
<script src="<?php echo Yii::app()->theme->baseUrl;?>/js/jquery.cookie.js"></script>
<script src="<?php echo Yii::app()->theme->baseUrl;?>/js/fullcalendar.min.js"></script>
<script src="<?php echo Yii::app()->theme->baseUrl;?>/js/jquery.dataTables.min.js"></script>
<script src="<?php echo Yii::app()->theme->baseUrl;?>/js/excanvas.js"></script>
<script src="<?php echo Yii::app()->theme->baseUrl;?>/js/jquery.flot.min.js"></script>
<script src="<?php echo Yii::app()->theme->baseUrl;?>/js/jquery.flot.pie.min.js"></script>
<script src="<?php echo Yii::app()->theme->baseUrl;?>/js/jquery.flot.stack.js"></script>
<script src="<?php echo Yii::app()->theme->baseUrl;?>/js/jquery.flot.resize.min.js"></script>
<script src="<?php echo Yii::app()->theme->baseUrl;?>/js/jquery.chosen.min.js"></script>
<script src="<?php echo Yii::app()->theme->baseUrl;?>/js/jquery.uniform.min.js"></script>
<script src="<?php echo Yii::app()->theme->baseUrl;?>/js/jquery.cleditor.min.js"></script>
<script src="<?php echo Yii::app()->theme->baseUrl;?>/js/jquery.noty.js"></script>
<script src="<?php echo Yii::app()->theme->baseUrl;?>/js/jquery.elfinder.min.js"></script>
<script src="<?php echo Yii::app()->theme->baseUrl;?>/js/jquery.raty.min.js"></script>
<script src="<?php echo Yii::app()->theme->baseUrl;?>/js/jquery.iphone.toggle.js"></script>
<script src="<?php echo Yii::app()->theme->baseUrl;?>/js/jquery.uploadify-3.1.min.js"></script>
<script src="<?php echo Yii::app()->theme->baseUrl;?>/js/jquery.gritter.min.js"></script>
<script src="<?php echo Yii::app()->theme->baseUrl;?>/js/jquery.imagesloaded.js"></script>
<script src="<?php echo Yii::app()->theme->baseUrl;?>/js/jquery.masonry.min.js"></script>
<script src="<?php echo Yii::app()->theme->baseUrl;?>/js/jquery.knob.js"></script>
<script src="<?php echo Yii::app()->theme->baseUrl;?>/js/jquery.sparkline.min.js"></script>
<script src="<?php echo Yii::app()->theme->baseUrl;?>/js/custom.js"></script>
<script src="<?php echo Yii::app()->assetManager->baseUrl; ?>/28e7347b/jquery.ba-bbq.js"></script>
<script src="<?php echo Yii::app()->assetManager->baseUrl; ?>/28e7347b/jquery.ajaxqueue.js"></script>
<script src="<?php echo Yii::app()->assetManager->baseUrl; ?>/dd5f9a70/gridview/jquery.yiigridview.js"></script>
</body>
Here is the controller that is rendering the view:
public function actionUpdateProductData() {
Yii::import('application.components.DataScraper.*');
require_once('GetProductData.php');
$productRealTime = RealTime::model()->findAll();
if (isset($_GET['RealTime'])) {
$productRealTime->attributes = $_GET['RealTime'];
}
if (count($productRealTime->model()->findAll()) === 0) {
$symbolData = new GetProductData();
$symbolData->getAmazonProductData();
} else {
echo CJSON::encode( array(
'status' => 'OK',
'div' => $this->renderPartial('_productDataGrid', array(
'model' => $productRealTime),
true, true ),
));
}
}
and here is the view _productDataGrid.php:
<?php
$this->widget('bootstrap.widgets.TbGridView', array(
'id' => 'real-time-grid',
'dataProvider' => $model->search(),
'filter' => $model,
'columns' => array(
'id',
'name',
'category',
'price'
'rating'
),
));
?>
and here is index.php:
<div>
<hr>
<ul class="breadcrumb">
<li>
<a href="#">Home</a> <span class="divider">/</span>
</li>
<li>
<a href="#">Stock Info</a>
</li>
</ul>
<hr>
Last of all Here is the ajaxProductDataUpdate.js
var productParameters = {
ajaxUpdate: function() {
$.ajax({
url: "/ProductAnalysis/index.php/realTime/updateProductData",
type: "GET",
dataType:"json",
error: function(xhr, tStatus, e) {
if (!xhr) {
alert(" We have an error ");
alert(tStatus + " " + e.message);
} else {
alert("else: " + e.message); // the great unknown
}
},
success: function(data) {
$.fn.yiiGridView.update('real-time-grid', {
data: $(this).serialize()
});
}
});
}
};
$(document).ready(function() {
productParameters.ajaxUpdate();
});
I just don't know what to do to fix the error. And I need to use gridview badly, in my case... Please provide any help on how to fix the error.
Thanks,
Maxx
