Последние темы


tagManager2 + разметка по БЭМ

  • Здравствуйте. Не так давно был вопрос о инпатах и баттонах - редактировании количества позиций, при разметке по БЭМ(http://forum.modx-shopkeeper.ru/topic/1099/кнопки-у-shk-count). Проблему так и не решил, пришлось просто убрать возможность изменения количества товаров при заказе.
    Подскажите, можно ли как-то заставить tagManager2 работать вот с такой разметкой для фильтра:
    Стандартный шаблон для row:

    <div class="filter_row">
        <input type="checkbox" id="[[+name]]__[[+idx]]" name="[[+flt_name]]" value="[[+value]]" />
        <label for="[[+name]]__[[+idx]]">[[+value_name]]</label>
    </div>
    

    Необходимый шаблон для row

    <div class="filter__row">
       <label class="checkbox checkbox--size-l" >
           
           <span class="checkbox__box">
               <input class="checkbox__control" type="checkbox" id="[[+name]]__[[+idx]]" name="[[+flt_name]]" value="[[+value]]">
           </span>
           
          <span class="checkbox__text" role="presentation" for="[[+name]]__[[+idx]]">[[+value_name]]</span>
       </label>
    </div>
    

    Вроде бы для каждого из возможных фильтров есть шаблон, для тонкой настройки, но вот настроить корректную работу все же не выходит.
    При такой разметке не выводятся численная информация по каждому значению фильтра – циферка в теге <sup>, возможно, потому что такой вывод закрепляется не за конкретным селектором или классом в разметке, а по тегу возле родителя (прошу прощения, javascript знаю поверхностно). Возможно можно переписать кусочек кода, отвечающий за это? То есть что бы разметка на это вообще не влияла, а нужно лишь было прописать нужные классы или айди.

    Также, при такой разметке фильтр срабатывает, происходит выборка, но если чекбокс отключить, то ничего не произойдет – урл не поменяется, выборка останется прежней, то есть чекбокс работает только на включение, отключение никак не меняет выборку.
    При отключении чекбокса, в консоли вот такая ошибка:

    Uncaught TypeError: t.removeAttr is not a function
    

    При стандартной разметке, проблем в работе не наблюдается
    Возможно, в следующих версиях компонента, можно будет учесть такие моменты и сделать компонент еще более гибким в разметке? Если это конечно возможно

  • В конфигурации filters.js есть такой параметр

    filters_cont: '#filters',//Селектор оберточного элемента блоков с фильтрами
    

    Может вы убрали этот ID, надо вернуть или указать другой селектор.

  • Эта запись удалена!
  • @andchir Нет, там прописан другой селектор, с этим все в порядке, да и работает со стандартным шаблоном tm2_filterTpl, а этот селектор выше находится:
    0_1522083463096_2aca007f-20b9-4b6d-a320-7b3a4b2cf29d-image.png
    0_1522083490303_eace3a09-4caf-4222-95c2-c73d7ee5c194-image.png
    Различие именно в самой разметке tm2_filterTpl - со стандартным работает, со своим, работает только на включение

  • Если дадите ссылку, посмотрю.

  • @andchir Прошу прощения, была ошибка у меня в скрипте, теперь чекбокс работает как нужно. За исключением одного момента. При обновлении страницы мои классы для активного чекбокса, которые проставляет jq, слетают, что и понятно. Но у вас, при стандартном шаблоне, активные чек боксы запоминаются. Вы не подскажете, как можно получить список активных чекбоксов, после обновления страницы? Что бы я смог снова пройтись по ним скриптом и расставить классы, которые отвечают за стиль активных чекбоксов? Пробую вот так, но не работает:

    $(document).ready(function(){
        $('.checkbox__control').each(function(){
    
            if($(this).prop("checked")){
                console.log($(this));
            }
    
        });
    });
    

    То есть при обновлении страницы, мне нужно сохранить класс родителю активного чекбокса
    0_1522146000440_f30682a0-16bf-4bd7-93e4-b313836ff180-image.png

  • Вы не подскажете, как можно получить список активных чекбоксов

    Ну если есть активные чекбоксы, берите эти чекбоксы и ставьте классы где нужно. Возможно, нужно использовать событие не $(document).ready, а $(window).load.

  • @andchir стилизация чекбокса, активного и неактивного происходит через родителя. То есть, я нажал на чекбокс, родитель получил класс .checkbox--checked и визуально стал активным. Когда я обновляю страницу, класс .checkbox--checked пропадает, он ведь нигде не запоминается и его нужно проставить заново, что бы визуально чекбокс был активным. Просто у вас, при стандартном шаблоне, при обновлении страницы все активные чекбокса остаться активными, то есть это где-то запоминается, так вот можно ли как то получать список тех чекбоксов, которые активны?
    Я отправлю ссылку в личное сообщение, что бы было понятно, что я имею ввиду

  • Вы хотя бы как-нибудь пытались получить список активных чекбоксов? Например так:

    $(':checkbox:checked', tmFilters.config.filters_cont).each(...
    
  • Участник @andchir написал в tagManager2 + разметка по БЭМ:

    $(window).load

    Получилось получить чекбоксы, в JQ новых версий события по другому нужно отслеживать, прошу прощения, вот так работает:

    $(window).on('load', function(){
    
        $('input[type=checkbox]').each(function(){
    
            if($(this).prop("checked")){
                console.log("1");
            }
    
        });
    });
    
  • @andchir спасибо за помощь и терпение.
    Вот так вроде бы полностью работает, возможно кому-то пригодится:

    $(window).on('load', function(){
    
        $('.checkbox__control').each(function(){
    
            if($(this).prop("checked")){
                $(this).closest(".checkbox").addClass('checkbox--checked');
            }
    
        });
    });
    
  • Для вывода цифры по каждому фильтру в своем теге использовал вот такую разметку:

     <div class="filter__row">
        <label class="checkbox checkbox--size-l">
            
            <span class="checkbox__box">
                <input type="checkbox" id="[[+name]]__[[+idx]]" name="[[+flt_name]]" value="[[+value]]" class="checkbox__control" />
            </span>
            
        <span class="checkbox__text" for="[[+name]]__[[+idx]]"  role="presentation">[[+value_name]]</span>
        <span class="checkbox__count"></span>
        </label>
        
    </div>
    
    

    Значение записывается в тэг с классом checkbox__count
    Немного переписал filter.js

    /**
         * updateMarkerCount
         *
         */
        updateMarkerCount: function(elem, count){
            
            // var elem_parent = elem.parent();
            var elem_parent = elem.closest(".checkbox");        
            
            if ( tmFilters.config['filters_type'] != 'only_block' ) {
    	    
                if ( elem.is('input:checked') ) {
                    
                    $('.checkbox__count',elem_parent).text("");
                    
                }else{                
    		
    		$('.checkbox__count',elem_parent).text(count);		
    		
                }
            }
            
            if (count == 0) {
                
                elem_parent.addClass('checkbox--disabled');
                if ( tmFilters.config['filters_type'] != 'only_block' ){
                    $('.checkbox__count',elem_parent).text("");
                }
                $('input:checkbox,select',elem_parent).prop('disabled','disabled');
                
            }else{
                
                elem_parent.removeClass('checkbox--disabled');
                $('input:checkbox,select',elem_parent).prop('disabled', false);
                
            }
            
        },
    
    

    Может кому-то будет полезно

 

Последние комментарии

  • D

    @Andchir
    Исходя из ошибки выше:

    в ваш плагин было бы неплохо добавить проверку на существование выбранного ресурса, что-бы исключить появление данной ошибки вы собираетесь дорабатывать плагин для работы с данными MIGX db, которые не имеют связи с ресурсами, а "живут" в отдельной таблице и редактируются через CMP?

    Читать далее
  • D

    @Andchir
    [23-Aug-2019 16:30:27 Europe/Moscow] PHP Fatal error: Uncaught Error: Call to a member function get() on null in /home/a0139615/domains/new.bistriki.com/public_html/core/components/catalogfill/model/catalogfill.class.php:459
    Stack trace:
    #0 /home/a0139615/domains/new.bistriki.com/public_html/core/components/catalogfill/processors/mgr/export.php(32): Catalogfill->csv_export('web')
    #1 /home/a0139615/domains/new.bistriki.com/public_html/core/model/modx/modprocessor.class.php(361): include('/home/a0139615/...')
    #2 /home/a0139615/domains/new.bistriki.com/public_html/core/model/modx/modprocessor.class.php(177): modDeprecatedProcessor->process()
    #3 /home/a0139615/domains/new.bistriki.com/public_html/core/model/modx/modx.class.php(1764): modProcessor->run()
    #4 /home/a0139615/domains/new.bistriki.com/public_html/core/model/modx/modconnectorresponse.class.php(144): modX->runProcessor('export', Array, Array)
    #5 /home/a0139615/domains/new.bistriki.com/public_html/core/model/modx/modconnectorrequest.class.php(86): modConnectorResponse->outputContent(Array)
    #6 /home/a0139615/ in /home/a0139615/domains/new.bistriki.com/public_html/core/components/catalogfill/model/catalogfill.class.php on line 459

    Читать далее
  • L

    @Dolce подскажите, как решили проблему? у меня тоже самое

    Читать далее
  • @knplabs :

    Удалил - ничего не изменилось. При очистке кэша висит прелоадер 16 секунд. Потом выдает ту же ошибку.

    Попробуйте удалить все папки в папке /var/cache/. У меня такого не было. Советую использовать http://devilbox.org/ вместо xampp. Там и MongoDB есть.

    Читать далее