0

私は 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 呼び出しが行われ、パラメーター $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 が有効になっていない場合に、製品リストを 1 つのブランドのみでフィルタリングできる場合も許容されます。

4

2 に答える 2

1

私が提案するのは、フィルターHTMLをフォームで囲み、フォームのアクションをAJAXフィルターに使用したのと同じアクションに設定することです。

SEOを検討している場合は、フォームをgetメソッドを使用して送信する必要があります。その後、Yiiのリクエストオブジェクトを使用できます。

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

処理されているのがAJAXリクエストなのか、非スクリプトバージョンなのかを判断します。

フォームフィルターの送信ボタンをいくつかのタグで囲むことができます。

ページをリロードする前にどのチェックボックスが選択されたかを知ることに関しては、javascriptなしでそれが可能かどうかは完全にはわかりません。

于 2012-12-04T09:29:38.613 に答える
0

JavaScript を使用したくない場合は、

<noscript>Please enable javascript</noscript>

または、チェックボックスが選択された後にページを更新し、php で要素の表示/非表示を行います。

于 2012-12-03T18:50:49.847 に答える