Facing Trouble With $.fn.yiigridview.update , Filters, Sort, Paging Getting Reset To Null, Filters, Sort, Paging Getting Reset To Null

Hi, i have a CGridview which is refreshed at a specific interval. The sorting, filtering and the pagination are all done by ajax and are working great. The problem is that $.fn.yiiGridView.update is updating the grid at a specific interval, due to which the filter, sort, pagination property are getting reset to null and the grid is displaying the 1st page upon each refresh.

This is the view in question, _productDataGrid.php





<?php


$this->widget('bootstrap.widgets.TbGridView', array(

    'id' => 'realtime-gridAMZ',

    'itemsCssClass' => 'table table-dark table-striped ',

    'htmlOptions' => array(

        'class' => 'product-datagrid',

    ),

    'dataProvider' => $model->search(),

    'filter' => $model,

    'ajaxUpdate' => 'realtime-gridAMZ',

    'ajaxUrl' => Yii::app()->createUrl('realTime/AjaxUpdate'),

    

    'pager' => array(

        'header' => '',

        'cssFile' => false,

        'maxButtonCount' => 10,

        'selectedPageCssClass' => 'active',

        'hiddenPageCssClass' => 'disabled',

        'firstPageCssClass' => 'previous',

        'lastPageCssClass' => 'next',

        'firstPageLabel' => '<<',

        'lastPageLabel' => '>>',

        'prevPageLabel' => '<',

        'nextPageLabel' => '>',

    ),

    'summaryCssClass' => 'label label-warning',

    'columns' => array(

        'id',

        'name',

        'category',

        'price'

        'rating'


        

    ),


));

?>






Here is the main index.php view which is displaying the grid initially upon page load.





<div class="box span12" onTablet="span6" onDesktop="span12">

        <div class="box-header">

            <h2><i class="icon-list"></i><span class="break"></span>AMZ</h2>

            <div class="box-icon">

                <a href="#" class="btn-minimize"><i class="icon-chevron-up"></i></a>

                <a href="#" class="btn-close"><i class="icon-remove"></i></a>

            </div>

        </div>

        <div class="box-content">

            <?php

            $this->renderPartial('//realTime/_productDataGrid', array(

                'model' => new RealTime(),

            ));

            ?>

        </div>        

    </div><!--/span-->

</div>




<?php

 $baseUrl = Yii::app()->baseUrl;

        $cs = Yii::app()->getClientScript();

        $cs->registerScriptFile($baseUrl . '/js/ajaxProductDataUpdate.js');

?>




This is the jquery file which sets the timer and call the grid update function. ajaxProductDataUpdate.js





function updateAMZGrid() {

    $.fn.yiiGridView.update('realtime-gridAMZ', {

        data: $(this).serialize()

    });

    return false;

}


$(document).ready(function() {

    setInterval(updateAMZGrid, 60000);

    

});




And lastly here is the actionAjaxUpdate in RealTimeController responsible for the ajax rendering





public function actionAjaxUpdate() {

        $dataProvider = new RealTime();

        $dataProvider->unsetAttributes();

        

        if (isset($_GET['RealTime']))

            $dataProvider->attributes = $_GET['RealTime'];

        $this->renderPartial('_producDataGrid', array(

            'model' => $dataProvider,

        ));

        

    }




Now, like i mentioned above all the functionality are working as desired. But the filter, sort, paging property is getting reset upon each call to yiiGridViewUpdate. So for example if a user is currently viewing page 24 of the table, after 1 minute the grid will be updated and he will be redirected to the front page of the table or page 1.

Same thing with filter, suppose the user enters a search keyword, and he is viewing the result, again after 1 min he will be seeing the front page or page 1 of the table, and the filter result will be gone. Thus he again have to type in the search keyword in the filter box, after 1 min.

Now, this is a big hindrance for anyone browsing the data through the grid.

Does anyone knows a fix for this? Please let me know what should i do to make it work properly. I’m trying to fix it by trial and error but i’m getting nowhere.

Thanks in advance,

Maxx

Does anyone knows a fix for this. I’m in desperate need for a viable solution.

Thanks

Hi,

I have a query… do u know how after deletion in cgridview…its retaining all the filter values and sort type…

If you know the answer…then its easy to solve your problem… if you dont know… try to analyse this… how it works…

Thanks for your reply. Well do you mean after the deletion of the filter text. If you do well, right now after searching for a data from a random page number using the filter, im getting the correct result. But after clearing the search result i’m again being redirected to the first page or page 1 of the table.

Looks like the problems are related, like you mentioned. Do you know a way to fix this?

Thanks again, for your tips.

What are the contents of $.fn.yiiGridView.settings[‘realtime-gridAMZ’] on page load and after the grid is update? Are the settings being lost somewhere?

Matt

How do i check the contents of $.fn.yiiGridView.settings[‘realtime-gridAMZ’]. I tried viewing it on firebug but i can’t find that array anywhere.

ok after doing a


 console.log($.fn.yiiGridView.settings['realtime-gridTSX']) 

, i’m getting this in firebug




ajaxType

	"GET"

	

ajaxUpdate

	["realtime-gridAMZ"]

	

0

	"realtime-gridAMZ"

	

ajaxVar

	"ajax"

	

enableHistory

	false

	

filterClass

	"filters"

	

filterSelector

	"#realtime-gridAMZ .filters input, #realtime-gridAMZ .filters select"

	

loadingClass

	"grid-view-loading"

	

pageVar

	"RealTime_page"

	

pagerClass

	"pagination"

	

selectableRows

	1

	

tableClass

	"table.table-dark.table-striped.table"

	

updateSelector

	"#realtime-gridAMZ .pagination a, #realtime-gridAMZ .table.table-dark.table-striped.table thead th a.sort-link"

	

url

	"/ProductAnalysis/index.php/realTime/AjaxUpdate"

	

afterAjaxUpdate

	function()




I guess the setting variable is getting reset after each call to


$.fn.yiiGridView.update

Do you know how i can prevent the settings from getting reset back to default.

Thanks again for all your help.

Hi,

you have problem with renderpartial … just pass true,false as third and fourth parameter… Its removing your gridview.js when u renderpartial…

I ran your code and only ran into problems when using “ajaxUrl”. Are you sure it’s pointing to a legit controller/action? Try removing it and let the grid update itself from the default URL.

Yes the controller/action url is a valid one. Like i mentioned in my post, the grid is updating fine from the given ajax URL. But the filter, paging, sorting values are lost when the grid refreshes.

Thanks again for your help. I just can’t figure out how to fix this issue.

Ok, i’ve tried doing that but, it didn’t helped.

Here is how the action looks





public function actionAjaxUpdateTimer() {

        /*

         * Open the session

         * 

         */

        $session = new CHttpSession;

        $session->open();


        /*

         * Include the Yahoo data scraper

         * 

         */

        Yii::import('application.components.DataScraper.*');

        require_once('GetProductData.php');





        $dataProvider = new RealTime();

        $dataProvider->unsetAttributes();


        if (isset($_GET['RealTime']))

            $dataProvider->attributes = $_GET['RealTime'];


        

        if (!isset($_GET['RealTime'])) {

            $productData = new GetProductData();

            $productData->setProductStore($session["store_name"]);

            $symbolData->getAmazonProductData();

        }


        /*

         * 

         * Render the partial view

         * 

         */

        $this->renderPartial('_productDataGrid', array(

            'model' => $dataProvider,

             TRUE,

             FALSE

        ));

    }




the grid is still getting back to default

Hi,

I had the same problem, and I made a cheat. I don’t know if it is good enough, since I’m noob.

I have observed

<div class="keys" title="…">

<span>xx</span>

</div>

inside the ".grid-view".

in my case:




<div class="keys" title="/ibg/Resident/admin?Resident%5Bfirstname%5D=&Resident%5Bmiddlename%5D=Developer&Resident%5Blastname%5D=&Resident%5Balias%5D=&Resident_page=1&ajax=resident-grid" style="display:none">

<span>20</span>

</div>



It seems that the value of the “title” attribute is changed upon each filtering and the content actually changes to the search query’s URL.

So my cheat is about to use this URL directly as the url in the ajax call

my model class in this case is "Resident".




// Change the "resident-grid" with your own grid's id in the following lines

var url = $("#resident-grid>.keys").attr("title");

$.fn.yiiGridView.update("resident-grid",{

	url:url,

});



I hope that this helps someone :)

Have a nice Dayii.