2013-08-21 2 views
1

Я использую функцию yiiGridView javascript для автоматического обновления gridview с контактами каждые 4 секунды (с использованием setInterval). Когда мышь находится над одной из кнопок «Просмотр», «Редактировать» или «Удалить», всегда появляется всплывающая подсказка (я использую расширение yy bootstrap, чтобы иметь лучший графический дизайн для всплывающих подсказок). Однако, когда запрос ajax обновляет gridview, всплывающая подсказка исчезает и больше никогда не отображается в google chrome, если я не буду снова перемещать мышь. В firefox и IE всплывающая подсказка скрывается, но затем она автоматически появляется снова. Есть ли какая-либо функция, которую я могу вызвать, чтобы заставить всплывающую подсказку, отображаемую для отображения снова, если мышь продолжается в том же положении, что и раньше? Думаю, мне нужно было бы вызвать такую ​​функцию в полной функции yiiGridView? Кто-нибудь может мне помочь, пожалуйста!Показать подсказку после обновления Gridview с помощью Ajax

Вот код JS, который я использую, чтобы автоматически обновлять вид сетки:

setInterval(function(){ 
     $('#contact-grid').yiiGridView('update', { 
       data: $(this).serialize(), 
       complete: function(jqXHR, status) { 

       } 
     }); 
},4000) 

Большое спасибо.

+0

Использование 'setInterval()' с AJAX не является хорошей идеей, из-за его асинхронным характера и де-синхронизации. –

+0

Что вы рекомендуете? Спасибо. – SnitramSD

+0

Рекурсивно используйте функцию setTimeout() 'и ajax callback. –

ответ

3

Вы должны фактически использовать 'afterAjaxUpdate' в CGridView

/** 
* @var string a javascript function that will be invoked after a successful AJAX response is received. 
* The function signature is <code>function(id, data)</code> where 'id' refers to the ID of the grid view, 
* 'data' the received ajax response data. 
*/ 
public $afterAjaxUpdate; 

Вы можете использовать его как это:

<?php 
$this->widget('zii.widgets.grid.CGridView', array(
    'id' => 'mygrid', 
    'dataProvider' => $dataprovider, 
    'afterAjaxUpdate' => 'function(){$(\'[data-toggle="tooltip"]\').tooltip({ html:true, trigger:\'hover\'})}', // <-- this line does the trick! 
    'columns' => array(
     'name', 
     'address', 
     ... 
    ), 
)); 
?> 
Смежные вопросы