Onclick event checkbox : Opencart Filter Module

Opencart v.1.5.xx mempunyai module bawaan yang sangat bagus, yaitu Filter module.. cara kerja module ini adalah untuk filter kategori berdasarkan sesuatu, misal dalam elektronik itu spesifikasi nya, filter by ram, storage, brand, ukuran layar nya dll.

Untuk bawaan default nya checkbox daripada filter ini harus menggunakan button untuk eksekusi nya di paling bawah filter nya, nah menurut saya untuk membuat user friendly sebaiknya digunakan semacam Onclick event jika checkbox terpilih, jadi langsung ganti url tanpa harus klik button nya, berikut contoh nya:

Buka file module filter ini di catalog > view > theme > yourtheme > template > module > filter.tpl
Didalam nya ada code javascript, lalu rubah menjadi :

Code:

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

    // bind onChange event to the checkboxes
    $('.tm-hide').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>

Keterangan : .tm-hide merupakan class yang akan di eksekusi, gunakan class tersebut pada input checkbox nya, misal kamu ingin menggunakan class lain

contoh :

Code:

<li>
  <input class="tm-hide" type="checkbox" value="<?php echo $filter['filter_id']; ?>" 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 class="tm-hide" type="checkbox" value="<?php echo $filter['filter_id']; ?>" id="filter<?php echo $filter['filter_id']; ?>" />
  <label for="filter<?php echo $filter['filter_id']; ?>"><?php echo $filter['name']; ?></label>
</li>

Untuk demo bisa dilihat disini http://www.teknologs.com/Gadget-c18.php , silahkan klik checkbox yang ada di filter nya sebelah kiri

Resource: http://stackoverflow.com/questions/...dd-onclick-event-to-replace-the-submit-button

Semoga bermanfaat

 

Situsnya ringan kayak gak berasa load.

 

Iya padahal lumayan banyak script nya dan css, mungkin karena cache

 

Betul mas , simple dan enak di pandang situsnya .

 

Wah canggih gan filter modulenya. bisa buat refrensi nih buat modul lain yang bisa menggunakan filter semacam ini. Makasih gan untuk share filter modulenya.