2013-10-27 7 views
6

ページから隠された送信ボタンを置き換えるために、Opencartフィルタにonclickイベントを追加したいと思います。これはjavascript/jquery実装は私を少し超えていますが、手伝ってもらえますか?Opencartフィルタは、送信ボタンを置き換えるためにonclickイベントを追加します。

PHP:

<div class="box"> 
<div class="box-heading"><?php echo $heading_title; ?></div> 
<div class="box-content"> 
    <ul class="box-filter"> 
    <?php foreach ($filter_groups as $filter_group) { ?> 
    <li><span id="filter-group<?php echo $filter_group['filter_group_id']; ?>"><?php echo $filter_group['name']; ?></span> 
    <ul> 
    <?php foreach ($filter_group['filter'] as $filter) { ?> 
    <?php if (in_array($filter['filter_id'], $filter_category)) { ?> 
    <li> 
     <input type="checkbox" value="<?php echo $filter['filter_id']; ?>" class="click_checkbox_manufacturers-filter" id="filter<?php echo $filter['filter_id']; ?>" checked="checked" /> 
     <label for="filter<?php echo $filter['filter_id']; ?>"><?php echo $filter['name']; ?></label> 
    </li> 
    <?php } else { ?> 
    <li> 
     <input type="checkbox" value="<?php echo $filter['filter_id']; ?>" class="click_checkbox_manufacturers-filter" id="filter<?php echo $filter['filter_id']; ?>" /> 
     <label for="filter<?php echo $filter['filter_id']; ?>"><?php echo $filter['name']; ?></label> 
    </li> 
    <?php } ?> 
    <?php } ?> 
    </ul> 
    </li> 
    <?php } ?> 
    </ul> 
    <a id="button-filter" class="button"><?php echo $button_filter; ?></a> 
</div> 
</div> 

HTML出力:

<div class="box"> 
<div class="box-heading">Refine Search</div> 
<div class="box-content"> 
    <ul class="box-filter"> 
    <li><span id="filter-group2">Colour</span> 
    <ul> 
    <li> 
    <input type="checkbox" value="33" class="click_checkbox_manufacturers-filter" id="filter33"> 
    <label for="filter33">Black</label> 
    </li> 
    <li> 
    <input type="checkbox" value="35" class="click_checkbox_manufacturers-filter" id="filter35"> 
    <label for="filter35">Blue</label> 
    </li> 
    <li><span id="filter-group4">Scent Name</span> 
    <ul> 
    <li> 
     <input type="checkbox" value="64" class="click_checkbox_manufacturers-filter" id="filter64"> 
     <label for="filter64">Almond</label> 
    </li> 
    <li> 
     <input type="checkbox" value="65" class="click_checkbox_manufacturers-filter" id="filter65"> 
     <label for="filter65">Coconut</label> 
    </li> 
    </ul> 
    </li> 
    </ul> 
    <a id="button-filter" class="button">Refine Search</a> 
</div> 
</div> 

はJavaScript

<script type="text/javascript"> 
$('#button-filter').bind('click', function() { 
    filter = []; 

    $('.box-filter input[type=\'checkbox\']:checked').each(function(element) { 
     filter.push(this.value); 
    }); 

    location = '<?php echo $action; ?>&filter=' + filter.join(','); 
}); 
//--></script> 

答えて

4

あなたはこのような何かを行うことができます(代わりに)現在のスクリプトの:ここで

<script type="text/javascript"> 
$(document).ready(function() { 
    // hide the "submit" button 
    $('#button-filter').hide(); 

    // bind onChange event to the checkboxes 
    $('.click_checkbox_manufacturers-filter').live('change', function() { 
     filter = []; 

     $('.box-filter input[type=\'checkbox\']:checked').each(function(element) { 
      filter.push(this.value); 
     }); 

     window.location = '<?php echo $action; ?>&filter=' + filter.join(','); 
    }); 
}); 
//--></script> 

は、驚くほど作業ある非常に同じJSコードのlink to my JsFiddleです。唯一の問題はリダイレクトである可能性があります...上記のリダイレクトコードを編集してもうまくいくはずです。

+0

動作していないようですか?それは? – Stuart

+0

@Stuart私の悪い、私は '生きている'機能が不足していた。今すぐお試しください... – shadyyx

+0

あなたの助けてくれてありがとうShadyx、しかしそれは動作しません..ボタンを隠す! – Stuart

1

バージョン2では、filter.plファイルのJavaScriptを(カタログ/ビュー/テーマ/デフォルト/テンプレート/拡張子/モジュール/ filter.tplから - 必要に応じて 'デフォルト'をテーマ名に変更します)この

OC 2.3.0.2でテスト済みです。

関連する問題