Yii“每页结果”在同一页面中加载其他ajax内容后，ajax下拉菜单中断了

Question

Yii中有一个视图，“患者”视图中有多个CGridViews和其他元素在初始视图之后加载了ajax被加载。一些是ajax加载在已经ajax加载的div中，意味着它们嵌套2层深。

在这些ajax加载的CGridViews我有下拉，让用户设置每个网格中每页的结果数量。这工作正常，直到用户使用ajax加载页面上的另一个元素。在另一个网格（或其他任何东西）被ajax加载之后，它会打破每页ajax函数的所有其他结果，除了刚才加载的那个。

类型错误：

加载任何其他与阿贾克斯后，其他CGridViews将使用每个页面下拉我的结果时，JavaScript错误抛出这样的设置是不确定的

内置CGridView寻呼机总是工作对所有网格都很好，所以我知道必须有一些方法让每个页面选择器的结果找到正确的$ .fn.yiiGridView来更新。

加载的cgridview内嵌控制器动作：

// $columns[]='normal_allele_depth'; 
// $columns[]='normal_allele_freq'; 

echo "<div class='results-selector'>"; 
echo "Results per page: ". 
    CHtml::dropDownList('gecgPageSize',$gecgPageSize,array(10=>10,20=>20,50=>50,100=>100),array(
     'onchange'=>" 
      $.fn.yiiGridView.update('gecg',{ data:{gecgPageSize: $(this).val() }}); 
     ", 
    )); 
echo "</div>"; 

$this->widget('zii.widgets.grid.CGridView', array(
    'id'=>'gecg', 
    'filter'=>$model, 
    'dataProvider'=>$dataProvider, 
    'columns'=>$columns, 
)); 
?> 

思考：

public function actionInlineSearch() 
{ 
    YiiSessions::model()->setFromRequestCookie(); 

    $model=new GeneExpressionCufflinksGene('search'); 
    $model->unsetAttributes(); // clear any default values 
    // page size drop down changed 

    if (isset($_GET['gecgPageSize'])) { 
     Yii::app()->user->setState('gecgPageSize',(int)$_GET['gecgPageSize']); 
     unset($_GET['gecgPageSize']); // would interfere with pager and repetitive page size change 
    } 
    $gecgPageSize=Yii::app()->user->getState('gecgPageSize'); 

    if(isset($_REQUEST['GeneExpressionCufflinksGene'])) 
     $model->attributes=$_REQUEST['GeneExpressionCufflinksGene']; 

    $this->renderPartial('inlineSearch',array('model'=>$model,'gecgPageSize'=>$gecgPageSize), false, true); 
} 

加载的CGridView插件的inlineSearch看法？

Answer 1

解决方案：有很多乱搞的后，我决定手动藏匿settings + $.fn.yiiGridView在每个inlineSearch意见的最后一个窗口变量，那么当每页选择我的项目是改变从窗口检索。

这不是一个非常优雅的解决方案（特别是因为传呼机工作正常，并且会导致多个$ .fn.yiiGridView实例漂浮在附近），但是很好。它的工作原理，虽然我仍然是Yii的一个小菜鸟，但我可以从我的研究中知道，有多个Ajax加载小部件有一些未解决的问题。

每页元素新成果在inlineSearch观点：

echo "<div class='results-selector'>"; 
echo "Results per page: ". 
    CHtml::dropDownList('gecgPageSize',$gecgPageSize,array(10=>10,20=>20,50=>50,100=>100),array(
     'onchange'=>" 
      $.fn.yiiGridView=window.gecgGridView; // necessary in case other other ajax load doesn't have the yiigridview js 
      $.fn.yiiGridView.settings['gecg']=window.gecgGridSettings; // because it will have been clobbered by other ajax grid load 
      $.fn.yiiGridView.update('gecg',{ data:{ gecgPageSize: $(this).val() }}); 
     ", 
    )); 
echo "</div>"; 

在inlineSearch视图结束，这样可以节省settings在window

<script type='text/javascript'> 
$(function(){ 
    window.gecgGridView=$.fn.yiiGridView; 
    window.gecgGridSettings={ 
          ajaxUpdate:["gecg"], 
          ajaxVar:"ajax", 
          pagerClass:"pager", 
          filterClass:"filters", 
          loadingClass:"grid-view-loading", 
          pageVar:"GeneExpressionCufflinksGene_page", 
          pagerClass:"GeneExpressionCufflinksGene_page", 
          selectableRows:1, 
          tableClass:"items", 
          updateSelector:"#gecg .pager a, #gecg .items thead th a", 
          afterAjaxUpdate:function(){} 
          }; 
}) 
</script> 

Answer 2

我不确定我得到了你所写的所有内容，但是你有信心：双深度加载CGridView的工作的传呼机？

Yii使用jQuery的.on()方法将事件处理程序附加到寻呼机的按钮，排序按钮，CButtonColumn类的按钮。如果您指定selector参数，则会为所有匹配的jQuery元素的后代触发事件on()方法被调用，对于此调用时现有的和不存在的方法。

Yii将处理程序附加到document元素，该元素始终存在（并且必须存在以允许触发事件）。你可以看到它在CGridView的init方法的例子zii/widgets/assets/gridview/jquery.yiigridview.js：

settings.updateSelector = settings.updateSelector 
    .replace('{page}', pagerSelector) 
    .replace('{sort}', sortSelector); 

gridSettings[id] = settings; 

if (settings.ajaxUpdate.length > 0) { 
    $(document).on('click.yiiGridView', settings.updateSelector, function() { 
     // Check to see if History.js is enabled for our Browser 
     if (settings.enableHistory && window.History.enabled) { 
      // ... 
     } else { 
      $('#' + id).yiiGridView('update', {url: $(this).attr('href')}); 
     } 
     return false; 
    }); 
} 

因此，如果您呈现CGridView小部件Ajax请求则寻呼机所有事件处理程序，排序等会附着部分渲染我想document ajax页面的元素，但不包含新加载的元素所属的主页面。如果您通过ajax加载您的inlineSearch视图，则可能与您的下拉列表发生同样的事情。

这就是为什么，正如我所看到的，所有事件处理程序都必须附加到最初加载页面的主非非Ajax视图的document元素。