Leaderboard


Popular Content

Showing content with the highest reputation on 07/19/14 in Сообщения

  1. 1 point
    abushyk

    Слайдер

    1. Инициализация значений в шаблон. Нам необходиом поймать знчения из запроса в шаблон для полей площадей. В /template/frontend/realia/standart_search_form.tpl в самом начале шаблона добавляем перехваты {if isset($smarty.request.square_min) && $smarty.request.square_min!=''}{assign var='square_min' value=$smarty.request.square_min}{else}{assign var='square_min' value=0}{/if}{if isset($smarty.request.square_max) && $smarty.request.square_max!=''}{assign var='square_max' value=$smarty.request.square_max}{else}{assign var='square_max' value=1000000}{/if}и чуть ниже, после var max_price={/literal}{if $max_price ne ''}{$max_price}{else}0{/if}{literal};var price_from=Number({/literal}{if isset($price_min)}{$price_min}{else}0{/if}{literal});var price_for=Number({/literal}{if (isset($price)) && ($price ne '')}{$price}{else}{$max_price}{/if}{literal});добавляем var square_all_max=Number(1000000);2. Формируем разметку. Слайдер состоит из трех элементов - двух межевых полей ввода и собственно слайдера. <!-- Межевое поле --><div class="beds control-group"> <div class="controls"> <input type="text" class="square_from square_field" name="square_min" value="{$square_min}"/> </div><!-- /.controls --> </div><!-- /.control-group --><!-- Межевое поле --> <div class="baths control-group"> <div class="controls"> <input type="text" class="square_for square_field" name="square_max" value="{$square_max}"/> </div><!-- /.controls --> </div><!-- /.control-group --> <!-- Слайдер --> <div class="price-value control-group"> <div class="controls"> <div class="square_slider"></div> </div><!-- /.controls --> </div>Значения межевых полей мы устанавливаем теми значениями, которые мы инициализировали в п.1 Разметку разместить в /template/frontend/realia/standart_search_form.tpl в теле формы поиска. 3. Навеска слайдера. /template/frontend/realia/js/search_form.js После функций asMoney() и number_format() доюавляем функцию function buidSlider(slider_el, min_el, max_el, maxvalue, asMoneyType){var min_value_now=min_el.val().replace(/\D/g,'');var max_value_now=max_el.val().replace(/\D/g,'');slider_el.slider({ range: true, min: 0, max: maxvalue, values: [ min_value_now, max_value_now ], slide: function( event, ui ) { if (ui.values[0]<0){ ui.values[0] = 0; } min_el.val(asMoneyType==true ? asMoney(ui.values[0]) : ui.values[0]); max_el.val(asMoneyType==true ? asMoney(ui.values[1]) : ui.values[1]); } });min_el.change(function(){ var value1=min_el.val().replace(/\D/g,''); var value2=max_el.val().replace(/\D/g,''); if (value1 > maxvalue) { value1 = maxvalue; min_el.val(asMoneyType==true ? asMoney(maxvalue) : maxvalue)} if(parseInt(value1) > parseInt(value2)){ value1 = value2; min_el.val(asMoneyType==true ? asMoney(value1) : value1); } slider_el.slider("values", 0, value1); });max_el.change(function(){ var value1=min_el.val().replace(/\D/g,''); var value2=max_el.val().replace(/\D/g,''); if (value2 > maxvalue) { value2 = maxvalue; max_el.val(asMoneyType==true ? asMoney(maxvalue) : maxvalue)} if(parseInt(value1) > parseInt(value2)){ value2 = value1; min_el.val(asMoneyType==true ? asMoney(value2) : value2); } slider_el.slider("values", 1, value2); });}которая и удет рисовать наши слайдеры. Функция потребляет в себя jQuery элементы сладйера, межевых полей и максимального значения. Расположенный чуть выше блок $(document).ready(function(){...});приводим к следующему виду $(document).ready(function(){$("input.price_field").autoNumeric({aSep: ' ', vMax: '999999999999', vMin: '0'});var simple_slider=$("div.property-filter .slider");var simple_price_from=$("div.property-filter input.price_from");var simple_price_for=$("div.property-filter input.price_for");buidSlider(simple_slider, simple_price_from, simple_price_for, max_price, true);var simple_slider=$("div.property-filter .square_slider");var simple_price_from=$("div.property-filter input.square_from");var simple_price_for=$("div.property-filter input.square_for");buidSlider(simple_slider, simple_price_from, simple_price_for, square_all_max);$('a.search_page_toggle').click(function(){$('div#simple_search').slideToggle();$('div#extended_search').slideToggle();return false;});});В принципе уже сейчас слайдер должен работать.