Сейчас узнаем, какой подарок выпадет именно Вам

Крутите колесо

Ура, вы выиграли!
Ваш приз:
Годовой доступ
к видео на mo-ti -20%
по промокоду T19RAY
Промокод действителен 3 дня

Оформить доступ с промокодом

100

#2470a1

Как ограничить выбор checkbox в Tilda

Create Something

Quisque id tincidunt dui augue. Suspendisse non lorem vel diam consectetur posuere. Nam eu enim gravida risus vehicula posuere.

Documantation

Get in touch

Please complete the form and we will get back to you.
Only three option ))

Как ограничить выбор checkbox в Tilda

Создали ZeroBlock и добавили в него Form

Создали поле Question with answers

Задали имя этому полю mycheck

Добавили код в блок Т123
В коде указали имя нашего поля
var chkName = 'mycheck';
И лимит выбора
length>=3

Mo-ti Level Up

Видео инструкции по добавлению кода и работе с Zero Block.

Получить полное видео

Посмотреть все видео

Делаем ограничение на кол-во выбранных галочек в форме. Работаем с несколькими формами.
Длительность видео: 28 минут

Фрагмент видео

Посмотреть видео в личном кабинете ►

Библиотека для примера

Выбор галочками


<script>
$(document).ready(function() {
var chkName = 'mycheck';
 $(document).on('change',  $('input[name="'+chkName+'"]').closest('.t-input-block').find('.t-checkbox')    ,function(e){     
    if($('input[name="'+chkName+'"]').closest('.t-input-block').find('.t-checkbox:checked').length>=3){ 
        $('input[name="'+chkName+'"]').closest('.t-input-block').find('.t-checkbox:not(:checked)').attr("disabled", true);
    }else{ $('input[name="'+chkName+'"]').closest('.t-input-block').find('.t-checkbox:disabled').attr("disabled", false);
    };
  });
});
</script>

Библиотека для примера

выбор с картинками


<script>
$(document).ready(function() {
var chkName = 'mycheck';
 $(document).on('change',  $('input[name="'+chkName+'"]').closest('.t-input-block').find('.t-img-select')    ,function(e){     
    if($('input[name="'+chkName+'"]').closest('.t-input-block').find('.t-img-select:checked').length>=3){ 
        $('input[name="'+chkName+'"]').closest('.t-input-block').find('.t-img-select:not(:checked)').attr("disabled", true);
    }else{ $('input[name="'+chkName+'"]').closest('.t-input-block').find('.t-img-select:disabled').attr("disabled", false);
    };
  });
});
</script>