Question

我正在使用YII，我有一个按品牌过滤产品的复选框过滤器。

这是我的过滤器HTML：

<dl class="brand-filter"> 
    <dd class="cat-text">  
        <input value="1" id="chb_1" class="brand-filter-chb" type="checkbox" name="brands[]">            
        <label for="chb_1" class="brand-filter-text" style=" display: inline-block;">Brand Name 1</label>      
    </dd>
    <dd class="cat-text">          
        <input value="2" id="chb_2" class="brand-filter-chb" type="checkbox" name="brands[]">            
        <label for="chb_2" class="brand-filter-text" style=" display: inline-block;">BRAND Name 2 </label>
    </dd>
    etc.
</dl>

当用户单击复选框时，jquery执行YII fn.yiiListView.update。这类似于ajax调用，它更新了我正在过滤的数据。对控制器/动作进行Ajax调用（在我的情况下，控制器是Product，action是List），参数$ brands被传递给控制器/动作。

这是我的过滤器javascript（Jquery）：

$('.brand-filter-chb').live('click', function(){        
    brands = $('#filter-form').serialize();     //brand names are serialized 
    $.fn.yiiListView.update(  //this updates product list by brand names
        'product-list',   //id of product list table
        {data: brands}   //serialized data send to controller/action by ajax call
    );    
});

这允许按品牌过滤产品列表。使用检查品牌名称复选框和列表已过滤。用户也可以检查多个品牌名称，一切正常。但是，如果没有Javascript，它就无法运行。

我想知道在没有javascript的情况下，允许相同或非常相似的用户体验的最佳解决方案是什么。例如，如果未启用javascript，则使用可以仅按一个品牌过滤产品列表也是可以接受的。

Answer 1

我建议将过滤器HTML放在表单中，并将表单的操作设置为您用于AJAX过滤器的相同操作。

如果您正在考虑搜索引擎优化，那么您的表单应该使用get方法提交，然后您可以使用Yii的请求对象：

Yii::app()->request->isPostRequest

确定它是正在处理的AJAX请求还是非脚本版本。

您可以将表单过滤器的提交按钮括在几个标记中。

至于知道在重新加载页面之前选择了什么复选框，我不完全确定没有javascript就可以。

Answer 2

如果你不想使用javascript，你可以做的是创建一个

<noscript>Please enable javascript</noscript>

或者在选中复选框后刷新页面并使用php显示/隐藏元素。

产品列表按复选框筛选，未启用Javascript

2 个答案: