Сбрасывает один скрипт, когда используется другой.

[Menro]

Всем привет!
Народ, помогите решить проблему.
Значит есть у меня фильтр на сайте, он там формирует значения фильтра. С помощью Jquery я оборачиваю .wrapAll что бы нормально сверстать.

И всё вроде бы хорошо, но когда я начинаю использовать ползунок фильтра по цене, все мои .wrapAll сбрасываются и фильтр расползается.

Нашёл js и то место которое отвечает за это:

    draggedKnob: function(mx){
        var lim = {}; var mi,mx;
        if(mx==null) {//alert(this.drag.value.now[this.z]);
            this.step =this.toStep(this.drag.value.now[this.z]);     
            this.checkStep();

       
        }else {
            this.maxstep = this.toStep(this.maxdrag.value.now[this.z]);
            this.checkStep(1);
        }

А вот собственно кусок кода который я применяю до этого ползунка:

jQuery(document).ready(function() {
    jQuery('#cf_wrapper_inner_virtuemart_manufacturer_id_171 > select').attr('size', '8');
    jQuery('#cf_flt_wrapper_virtuemart_manufacturer_id_171').wrapAll('<div class="col-md-4">');
    jQuery("#cf_flt_wrapper_price_171, #cf_flt_wrapper_custom_f_3_171, #cf_flt_wrapper_custom_f_4_171, #cf_flt_wrapper_custom_f_5_171, #cf_flt_wrapper_custom_f_6_171, #cf_flt_wrapper_custom_f_7_171, #cf_flt_wrapper_custom_f_8_171, #cf_flt_wrapper_custom_f_9_171, #cf_flt_wrapper_custom_f_10_171").wrapAll("<div class='col-md-4'></div>");
    jQuery("#cf_flt_wrapper_custom_f_11_171, #cf_flt_wrapper_custom_f_12_171, #cf_flt_wrapper_custom_f_13_171, #cf_flt_wrapper_custom_f_14_171, #cf_flt_wrapper_custom_f_15_171, #cf_flt_wrapper_custom_f_16_171, #cf_flt_wrapper_custom_f_17_171, #cf_flt_wrapper_custom_f_18_171, #cf_flt_wrapper_custom_f_19_171, #cf_flt_wrapper_custom_f_20_171, .cf_resetAll_link").wrapAll("<div class='col-md-4'></div>");
    });

Как мне вот мой кусок кода применить в том числе после взаимодействия с ползунком ну или не сбрасывать его когда ползунок задействован? Буду очень признателен!

 

[sol_los]

херней какой-то ты занимаешься.
весь фильтр нормально обернут дивами с классами, в чем проблемма написать пару строк css для уже существующих классов, а не оборачивать обязательно в бутстрапный col-md? или ты не умеешь пользоваться media запросами?

ну и раз уж ты задаешь вопрос, вот тебе решение

создаем
function yaZanimaysHuyney(){
jQuery('#cf_wrapper_inner_virtuemart_manufacturer_id_171 > select').attr('size', '8');
    jQuery('#cf_flt_wrapper_virtuemart_manufacturer_id_171').wrapAll('<div class="col-md-4">');
    jQuery("#cf_flt_wrapper_price_171, #cf_flt_wrapper_custom_f_3_171, #cf_flt_wrapper_custom_f_4_171, #cf_flt_wrapper_custom_f_5_171, #cf_flt_wrapper_custom_f_6_171, #cf_flt_wrapper_custom_f_7_171, #cf_flt_wrapper_custom_f_8_171, #cf_flt_wrapper_custom_f_9_171, #cf_flt_wrapper_custom_f_10_171").wrapAll("<div class='col-md-4'></div>");
    jQuery("#cf_flt_wrapper_custom_f_11_171, #cf_flt_wrapper_custom_f_12_171, #cf_flt_wrapper_custom_f_13_171, #cf_flt_wrapper_custom_f_14_171, #cf_flt_wrapper_custom_f_15_171, #cf_flt_wrapper_custom_f_16_171, #cf_flt_wrapper_custom_f_17_171, #cf_flt_wrapper_custom_f_18_171, #cf_flt_wrapper_custom_f_19_171, #cf_flt_wrapper_custom_f_20_171, .cf_resetAll_link").wrapAll("<div class='col-md-4'></div>");
}

вызываем после загрузки страницы

jQuery(document).ready(function() {
   yaZanimaysHuyney();
});


вызываем каждый раз после обновления фильтра

    draggedKnob: function(mx){
var lim = {}; var mi,mx;
if(mx==null) {//alert(this.drag.value.now[this.z]);
this.step =this.toStep(this.drag.value.now[this.z]);
this.checkStep();
yaZanimaysHuyney();

}else {
this.maxstep = this.toStep(this.maxdrag.value.now[this.z]);
this.checkStep(1);
yaZanimaysHuyney();
}

 

[Menro]

херней какой-то ты занимаешься.
весь фильтр нормально обернут дивами с классами, в чем проблемма написать пару строк css для уже существующих классов, а не оборачивать обязательно в бутстрапный col-md? или ты не умеешь пользоваться media запросами?

ну и раз уж ты задаешь вопрос, вот тебе решение

создаем
function yaZanimaysHuyney(){
jQuery('#cf_wrapper_inner_virtuemart_manufacturer_id_171 > select').attr('size', '8');
    jQuery('#cf_flt_wrapper_virtuemart_manufacturer_id_171').wrapAll('<div class="col-md-4">');
    jQuery("#cf_flt_wrapper_price_171, #cf_flt_wrapper_custom_f_3_171, #cf_flt_wrapper_custom_f_4_171, #cf_flt_wrapper_custom_f_5_171, #cf_flt_wrapper_custom_f_6_171, #cf_flt_wrapper_custom_f_7_171, #cf_flt_wrapper_custom_f_8_171, #cf_flt_wrapper_custom_f_9_171, #cf_flt_wrapper_custom_f_10_171").wrapAll("<div class='col-md-4'></div>");
    jQuery("#cf_flt_wrapper_custom_f_11_171, #cf_flt_wrapper_custom_f_12_171, #cf_flt_wrapper_custom_f_13_171, #cf_flt_wrapper_custom_f_14_171, #cf_flt_wrapper_custom_f_15_171, #cf_flt_wrapper_custom_f_16_171, #cf_flt_wrapper_custom_f_17_171, #cf_flt_wrapper_custom_f_18_171, #cf_flt_wrapper_custom_f_19_171, #cf_flt_wrapper_custom_f_20_171, .cf_resetAll_link").wrapAll("<div class='col-md-4'></div>");
}

вызываем после загрузки страницы

jQuery(document).ready(function() {
   yaZanimaysHuyney();
});


вызываем каждый раз после обновления фильтра

    draggedKnob: function(mx){
var lim = {}; var mi,mx;
if(mx==null) {//alert(this.drag.value.now[this.z]);
this.step =this.toStep(this.drag.value.now[this.z]);
this.checkStep();
yaZanimaysHuyney();

}else {
this.maxstep = this.toStep(this.maxdrag.value.now[this.z]);
this.checkStep(1);
yaZanimaysHuyney();
}

Спасибо!
Насчёт CSS я пока реально не могу понять, как мне это всё разбить на 3 блока.
А с функцией у меня тоже ничего не вышло, если вызывать функцию после обновления фильтра, то тоже ничего не оборачивается.
Щас поищу местечко, может быть в другое место надо вставить вызов функции.

 

[sol_los]

Насчёт CSS я пока реально не могу понять, как мне это всё разбить на 3 блока.

У тебя там и классы есть и уникальные Id-шники в чем проблемма сделать хотя бы так

@media (min-width:1200px){
   #cf_form_171 { display: table;}
  #cf_flt_wrapper_virtuemart_manufacturer_id_171{width:25%;display: table-cell}
  #cf_flt_wrapper_price_171{width:25%; display:table-cell}
}

или так

@media (min-width:1200px){ 
  .cf_wrapp_all .cf_flt_wrapper{width:33%;float:left;}
}

 

[Menro]

У тебя там и классы есть и уникальные Id-шники в чем проблемма сделать хотя бы так

@media (min-width:1200px){
   #cf_form_171 { display: table;}
  #cf_flt_wrapper_virtuemart_manufacturer_id_171{width:25%;display: table-cell}
  #cf_flt_wrapper_price_171{width:25%; display:table-cell}
}

или так

@media (min-width:1200px){
  .cf_wrapp_all .cf_flt_wrapper{width:33%;float:left;}
}

Этот код конечно не подошёл под тот вид фильтра, который у меня был заложен.
Поместил код вниз кода фильтра и всё заработало) Спасибо за помощь!