Как передать данные из формы с калькулятором в корзину через связку блоков BF402N+ST200 в Tilda
Деревянные европоддоны оптом
Цены на деревянные европоддоны в городе
"Городская сырьевая компания"
Расчёт стоимости партии
Размер
Кол-во
20
1000
Доставка по городу
Итоговая стоимость: 0 руб.
Европоддон
7200
р.
Размер
Кол-во
Доставка
When we first checked out our new headphones, we noticed the box said 'improved bass by cool. We had to wonder, is this marketing jargon, or the real thing? But it only took a moment to realize that bass was not kidding.

Как передать данные из формы с калькулятором в корзину через связку блоков BF402N+ST200 в Tilda

1
Создали форму с калькулятором BF402N
2
Добавили значения для калькулятора и присвоили полям имена переменных:
- размер - palsize
- количество - colvo
- доставка - deliveryvar
- сам калькулятор - itog
3
Добавили на страницу блок ST200
4
Добавили в него 3 параметра размер, кол-во, доставка. Прописали в них первое значение по умолчанию
5
Добавили скрипт на страницу
Скрипт вставляется в блок ДРУГОЕ►Т123
Mo-ti Level Up
Видео инструкции по добавлению кода и работе с Zero Block.
Создаём калькулятор в форме и при нажатии кнопки, от отправляем все данные с параметрами в корзину.
Длительность видео: 21 мин
Фрагмент видео
Библиотека для примера

<style>
/*Скрываем ST200*/
   div[data-record-type="744"]{
        display:none;
   }
  .t706__product-imgdiv {
    background-repeat: no-repeat;
    background-size: contain !important;
    background-color: #ffffff !important;
}
</style>
<script>
  $( document ).ready(function() {
var notLazyblock = '.t744 .t-slds__bgimg';
for(let i = 0; i < $(notLazyblock).length; i++){
$(notLazyblock).addClass('loaded plus');
$(notLazyblock+':eq('+i+')').css('background-image', 'url("'+$(notLazyblock+':eq('+i+')').data("original")+'")' );
};
//ПРи клике на нашу кнопку
  $('.t700 .t-submit').click(function() {
//Получаем значение Размера
    var palsize = $('select[name="palsize"]').val();
//Получаем значение Количества    
    var colvo = $('input[name="colvo"]').next('.t-range__value-txt').html();
//Получаем значение Способа доставки
    var delivery= $('input[name="deliveryvar"]:checked').val();
//Полчаем сумму калькулятора
    var itogo = $('input[name="itog"]').next('.t-calc__wrapper').children('.t-calc').html();

//ПРисваиваем значения из калькулятора для блока ST200
//Цена
  $('.t744__price-value').html(itogo);
//Размер
  $('.t744 select:eq(0) option:selected').val(palsize);
//Количество
  $('.t744 select:eq(1) option:selected').val(colvo);
//Доставка
  $('.t744 select:eq(2) option:selected').val(delivery);
 
//Отправляем заказ
 let fullinput=true;
 let mainBlk = $(this).closest('.t-rec');
    $('.t-input-group').removeClass('js-error-control-box');
    mainBlk.find('.js-tilda-rule[data-tilda-req="1"]').each(function() {
        if($(this).val()==''){$(this).closest('form').find('.t-submit').click(); fullinput=false; return false;};
    }); 
    if(fullinput){
    mainBlk.find('input[type="radio"][data-tilda-req="1"].js-tilda-rule').closest('.t-input-block').each(function() {
    if(!$(this).find('input[type="radio"]').is(':checked')){$(this).closest('form').find('.t-submit').click();fullinput=false; return false;  
    };});};
    if(fullinput){
    mainBlk.find('input[type="checkbox"][data-tilda-req="1"].js-tilda-rule').each(function() {
    if (!$(this).is(':checked')){ $(this).closest('form').find('.t-submit').click(); fullinput=false; return false;};
    });};
    
    if(fullinput){
        setTimeout(function() {  $(".t744__btn")[0].click(); }, 100);
    };
  return false;
});

 $(document).on("keydown", ".t-form", function(event) {return event.key != "Enter";});
});
</script>
Made on
Tilda