V
V
viktorulyushev2016-11-01 16:24:34
HTML
viktorulyushev, 2016-11-01 16:24:34

Bitrix. Why did the price stop changing?

There is a piece of code

<?foreach($arResult['SIZES'] as $id => $size):?>
        <label><input  type="radio"  name="size" class="js-sizeRadio" value="<?=$id?>" /><?=$size?></label>
 <?endforeach;?>

Just inputs, when selected, cents dynamically change, I need to make a drop-down list with the same values ​​​​from the inputs so that the price also changes, but for some reason it does not work, what could be the reason?
My code:
<select>
  <?foreach($arResult['SIZES'] as $id => $size):?>
    <option  type="radio"  name="size" class="js-sizeRadio" value="<?=$id?>"><?=$size?></option>
  <?endforeach;?>
</select>

Answer the question

In order to leave comments, you need to log in

2 answer(s)
K
kmx, 2016-11-01
@kmx

so JS probably updates the price, see the script that is responsible for this

V
viktorulyushev, 2016-11-03
@viktorulyushev

Here is the js code

<script type="text/javascript">
    $(document).ready(function(){
<?if (isset($_REQUEST["REPLIER_FORM_CLICK"])){?>
$('.AddReview').click();
  <?}?>
        <?if(!empty($arResult['SIZES_OPTIONS'])):?>
         var size_option = JSON.parse('<?=$arResult['SIZES_OPTIONS']?>');
       <?else:?>
           var size_option = [];
       <?endif;?>
       <?if(!empty($arResult['MATERIAL_SIZE'])):?>
            var size_material = JSON.parse('<?=$arResult['MATERIAL_SIZE']?>');
        <?else:?>
            var size_material = [];
        <?endif;?>
        <?if(!empty($arResult['DEFAULT_OFFER'])):?>
            var default_offer = JSON.parse('<?=$arResult['DEFAULT_OFFER']?>');
        <?else:?>
            var default_offer = [];
        <?endif;?>
        function selectSize(size) {
            $('.js-sizeRadio').removeAttr('checked');
            $('.js-sizeRadio[value=' + size + ']').attr('checked', 'checked');
            $('.js-sizeRadio').trigger('change');
        }
        function selectMaterial(material) {
            $('.js-material').val(material);
            $('.js-material').trigger('change');
        }
        function enableSizes(material) {
            $('.js-sizeRadio').attr('disabled', 'disabled');
            var selected = $('.js-sizeRadio:checked').val();
            var last_key = 0;
            a = size_material[material];
            findSelected = false;
            for (key in a) {
                if (a.hasOwnProperty(key)) {
                    if(key === selected) {
                        findSelected = true;
                    }
                    $('.js-sizeRadio[value="' + key + '"]').removeAttr('disabled');
                    last_key = key;
                }
            }
            if(!findSelected) {
                selectSize(last_key);
            }
        }
        function enableMaterials(size) {
            $('.js-SelectMaterialsSection > option').attr('disabled','disabled');
            var selected = $('.js-SelectMaterialsSection').val();
            var last_key = 0;
            findSelected = false;
            for (key in size_material) {
                if (size_material[key].hasOwnProperty(size)) {
                    if(key === selected) {
                        findSelected = true;
                    }
                    $('.js-SelectMaterialsSection > option[value="' + key + '"]').removeAttr('disabled');
                    last_key = key;
                }
            }
            if(!findSelected) {
                selectMaterial(last_key);
                return last_key;
            }
            return selected;
        }
        function selectMaterialItem(item) {
            $('.product-detail-choose-list > li').removeClass('selected');
            if(item){
                $('.product-detail-choose-list > li[rel="'+ item +'"]').addClass('selected');   
            }
        }
        function showMaterials(material) {
            $('.product-detail-choose-list').hide();
            $('.mats-' + material).show();
            selectMaterialItem(false);
        }
        function getOptionCost(size) {
            var opts = $('.js-option:checked');
            if(opts.length == 0) {
                return 0;
            }
            cost = 0;
            for (var i = opts.length - 1; i >= 0; i--) {
                cost += parseInt(size_option[size][$(opts[i]).val()]);
            };
            if(isNaN(cost)) {
                cost = 0;
            }
            return cost;
        }
        function getMaterialItem(){
            var mi = $('.product-detail-choose-list > li.selected');
            if(mi.length <= 0) {
                return 0;
            }
            return mi.attr('rel');
        }
        function showPrice(size, material) {
            var optionCosts = getOptionCost(size);
            var itemPrice = parseInt(size_material[material][size]);
            var price = optionCosts + itemPrice;
            $('.total_cost').html(price);
        }
        function enableOptions(size) {
            $('.js-option').attr('disabled','disabled');
            if(!size_option.hasOwnProperty(size)) {
                return false;
            }
            for (key in size_option[size]) {
                if (size_option[size].hasOwnProperty(key) && size_option[size][key] > 0) {
                    $('.js-option[value="' + key + '"]').removeAttr('disabled');
                    $('#price-' + key).html("&nbsp;&nbsp;&nbsp; +" + size_option[size][key] + " руб.");
                }
                else
                {
                    $('#price-' + key).html("");
                }
            }
            removeDisabledOptions();
        }
        function removeDisabledOptions()
        {
            $('.js-option:checked').each(function(index, el){
                var attr = $(this).attr('disabled');
                if (attr == "disabled") {
                    $(el).attr("checked", false);
                }
            });
        }
        function getSize() {
            return $('.js-sizeRadio:checked').val();
        }
        function getMaterial(){
            return $('.js-SelectMaterialsSection').val();
        }
        function getOptions(){
            var opt = [];
            $.each($('.js-option:checked'), function(k, v){
                opt.push($(v).val());
            });
            return opt;
        }
        function formPopulate(post){
            $('.js-quantity').val(post.quantity);
            $('.js-material-id').val(post.material);
            $('.js-offer-code').val(post.offer_code);
            $('.js-options-form-container').html('');
            for (var i = post.options.length - 1; i >= 0; i--) {
                var el = $('<input type="hidden" name="options[]" value="' + post.options[i] + '"/>');
                el.appendTo('.js-options-form-container');
            };
        }

        selectSize(default_offer['SIZE']);
        selectMaterial(default_offer['MATERIAL']);
        enableSizes(default_offer['MATERIAL']);
        enableMaterials(default_offer['SIZE']);
        enableOptions(default_offer['SIZE']);
        showMaterials(default_offer['MATERIAL']);
        showPrice(default_offer['SIZE'], default_offer['MATERIAL']);


        $('.js-SelectMaterialsSection').change(function(){
            enableSizes($(this).val());
            showMaterials($(this).val());
            showPrice(getSize(),getMaterial());
        });
        $('.js-sizeRadio').click(function(){
            var id = enableMaterials($(this).val());
            enableOptions($(this).val());
            selectMaterial(id);
            showMaterials(id);
            showPrice(getSize(),getMaterial());
        });
        $('.product-detail-choose-list > li').mousedown(function(ev){
            $(this).find('span').css('background-color', '#fff');
            $(this).find('span').css('color', '#4d6192');
        });
        $('.product-detail-choose-list > li').mouseup(function(ev){
            $(this).find('span').css('background-color', '#4d6192');
            $(this).find('span').css('color', '#fff');
        });
        $('.product-detail-choose-list > li').click(function(){
            selectMaterialItem($(this).attr('rel'));
        });
        $('.js-option').click(function(){
            showPrice(getSize(),getMaterial());
        });
        $('.product-detail-submit').click(function(ev){
            ev.preventDefault();
            if(getMaterialItem() <= 0) {
                alert('Пожалуйста, выберите обивочный материал');
                return false;
            }
            post = {};
            post.quantity = 1;
            post.offer_code = '<?=$arResult['ID']?>_' + getMaterial() + '_' + getSize();
            post.options = getOptions();
            post.material = getMaterialItem();
            formPopulate(post);
            return $(this).parents('form').submit();
        });
        $('.input-select').chosen();
        $('a.AddReview').fancybox({
            'width': '620'
        });
        $('a.fancybox-img').fancybox(
      {'width': 'auto'});
    });
</script>

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question