Where did you make a mistake?

  • 0
    Tell me where I screwed up the code, nothing happens when clicking on _filter-submit

    just started learning js and got confused

    there is a script for initializing the product filter

    import CatalogFilter from '../filter/CatalogFilter';
    
    $(function () {
      const $productFilter = $('#filter-products'); // Get filter container
    
      if ($productFilter.length) {
        try {
          const filter = new CatalogFilter();
          filter.init()
        } catch (error) {
          console.error(error)
        }
      }
    });


    and the class itself

    class CatalogFilter {
      init() {
      
        $('._products-sort_toolbar').on('click', '.drpw-item', function (event) {
          window.location = event.currentTarget.getAttribute('data-url');
        });
    
        $('.btn-toggle_filter').on('click', function () {
          var $root = $(this).closest('.filter-products');
          $root.find('._filter').toggleClass('open');
        });
    
        var Filter = (function () {
          function Filter(options) {
            var self = this;
            options = options || {};
            this.sort = options.sort || 0;
            this.url = options.url || '';
            this.$domElem = $('._filter');
            this.$filters = $('._filter-item');
    
            this.$domElem
              .on('click', '._filter-submit', function () {
                alert('sdfsdf');
                self.applyFilters.call(self);
              })
              .on('click', '.product-filter-sidebar__reset', function () {
                var state = {};
    
                if (self.sort) {
                  state.sort = self.sort;
                }
                window.location = self.getFilterUrl.call(self, state);
              });
            this.init();
          }
    
          Filter.prototype.getState = function () {
            var state = {};
            this.$filters.each(function () {
                var $values, i, ii;
                var $filter = $(this);
                var parameterID = $filter.attr('data-parameter-id');
                if (parameterID === 'color') {
                    $values = $('inout',this).attr("checked");
                    if ($values.length) {
                        state['color'] = [];
                        for (i = 0, ii = $values.length; i < ii; i++) {
                            state['color'].push($values.eq(i).val());
                        }
                    }
                } 
            });
            if (this.sort) {
                state.sort = this.sort;
            }
            return state;
        };
          Filter.prototype.getFilterUrl = function (state) {
            var url = $.isEmptyObject(state) ?
              this.url :
              this.url + (this.url.indexOf('?') > -1 ? '&' : '?') + $.param(state);
    
            return decodeURIComponent(url);
          };
          Filter.prototype.applyFilters = function () {
            var state = this.getState();
            window.location = this.getFilterUrl(state);
          };
        })();
        return Filter;

    }
    }

    export default CatalogFilter
    JavaScript Anonymous, Aug 29, 2019

  • 1 Answers
  • 0
    init () must be placed in the class constructor. This method just doesn't run and so the click handler doesn't hang either
    Ruby Sanford

Your Answer
To place the code, please use CodePen or similar tool. Thanks you!