Как к чекбоксу добавить поле ввода?

Question

[Raneto4ka]

В форме есть блок из нескольких чекбоксов. При этом последний пункт - это возможность написать свой вариант. При клике на это поле чекбокс должен отмечаться галочкой, если я заполняю поле, то галочка сохраняется.
Не знаю как правильно реализовать эту задачу. Самая проблема - это отслеживать, заполнено ли поле и надо поставить галочку, или человек ушел с него не заполнив его и надо галочку убрать.
Мой код, который отследивает только изменения состояния фокус.
https://codepen.io/Raneto4ka/pen/oaPjZj

Comments

[DanKud]

Повешать событие click на страницу, либо какое-нибудь другое, что больше подойдет для вас, и ставить checked при условии если value не пустой:

$(document).click(function() {
	if ($('#option28a').val()) {
		$('#option28').attr('checked', true);
	}
	else {
		$('#option28').attr('checked', false);
	}
});

Answer 1

[igumenov]

Я бы применил js в виде
При фокусе инпута отмечаем чекбокс, а при выходе из фокуса проверяем значение инпута и галочку либо оставляем либо убираем
.focusin()
.focusout()

Как-то так

$('.js-input').focusin(function() {
        $('.js-checkbox').prop('checked', true);
    }
    $('.js-input').focusout(function() {
        var inpVal = $(this).val();
        if(inpVal==''){
            $('.js-checkbox').prop('checked', false);
        }
    }