下拉值更改时更新 CGridView答案

【问题标题】：Update CGridView when a dropdown value changes下拉值更改时更新 CGridView
【发布时间】：2010-04-22 02:44:00
【问题描述】：

我有一个 CGridView，其中包含来自表 "product" => {'product_id','category_id',...} 的列我还有一张桌子"category" => {'category_id','category_name'}

category_id 是 product 表中的 FK。

现在我想要一个类别表的下拉列表，在选择特定值时，产品的 CGridView 应该更新为仅显示带有 category_id 的行。我还需要 CGridView 的列过滤/排序才能工作（使用 AJAX）。

当从下拉列表中选择一个值时，我能够刷新 CGridView，但是我没有能够为 CGridView 发送带有“数据”的 category_id：

clientScript->registerScript('search', "
$('.cat_dropdown').change(function(){
    $.fn.yiiGridView.update('order-grid', {
        data: $(this).serialize(),
    });
    return false;
});
");

data: $(this).serialize() 仅发送 CGridView 的过滤文本字段中存在的值。我如何附加 category_id 呢？

如果上述方法不正确，请提出替代方法。

【问题讨论】：

标签： php jquery ajax yii

【解决方案1】：

这就是我最终做到的方式。我不知道解决方案是否最佳，但它有效。欢迎任何cmets。 <pre></pre>

Yii::app()->clientScript->registerScript('yiiGridView.update', " $.fn.yiiGridView.update = function(id, options) { var settings = $.fn.yiiGridView.settings[id]; 变量数据 = { 'product[category_id]': $('.cat_dropdown option:selected').val(), }; 选项 = $.extend({ 类型：'GET'，数据：数据，成功：功能（数据，状态）{ $.each(settings.ajaxUpdate, function() { $('#'+this).replaceWith($(data).find('#'+this)); }); 如果（设置。更新后！=未定义） settings.afterUpdate(id, data); }, 错误：函数（XMLHttpRequest，textStatus，errorThrown）{ 警报（XMLHttpRequest.responseText）； } }, 选项 || {}); 如果（设置。更新前！=未定义） settings.beforeUpdate(id); $.ajax(选项); }; ");

然而，上述解决方案需要 CGridView 的 columns 选项中的category_id。如果将其删除，则其他列上的过滤将不起作用。如果保持过滤其他列的工作，但category_id 存在于网格中（这不是必需的）需要一种方法来隐藏 CGridView 或其他解决方案中的 category_id 列。

【讨论】：

【解决方案2】：

你只需要在CGridView中添加下拉菜单，仅此而已，例如：

array('name' => 'category_id', 'value' => 'Categories::model()->getCategoryName($data->category_id)', 'filter'=>CHtml::listData(Categories::model()->getCategoryObj(), 'category_id', 'category_name')),

查看以上内容，您需要在 Categories 类中添加两个方法：

getCategoryName 获取类别对象

阅读：

http://www.mattiressler.com/customising-cgridview-select-menu/

http://www.mattiressler.com/using-class-properties-to-minimise-database-queries/

您不需要添加任何 javascript :-)

【讨论】：