Как добавлять текст в input в зависимости от выбранного checkbox?

Question

[Сергей Гурджиян]

Написал такой код

<div class="formRow labelBox col3 dropDownMobile" id="workDesign">

  <input type="text" name="tags" id="workDesignTags">

  <label><input type="checkbox" name="design" value="Value 1"><span class="textBox">Value 1</span></label>
  <label><input type="checkbox" name="design" value="Value 2"><span class="textBox">Value 2</span></label>
  <label><input type="checkbox" name="design" value="Value 3"><span class="textBox">Value 3</span></label>
  <label><input type="checkbox" name="design" value="Value 4"><span class="textBox">Value 4</span></label>
</div>

$("#workDesign label").on("click", function(){
        var input = $(this).children("input");
        var tag = $(this).text();
        if (input.prop("checked"))  {
            input.parent().addClass("selected");
            alert(tag);
            $("#workDesignTags").val(tag);
        } else {
            input.parent().removeClass("selected");
        }
    });

var tagList;

Как сделать, что бы значение добавлялось, а не замещало собой старое?
Как сделать, что бы значение удалялось из всего value, если checkbox снят?

Answer 1

[evilandfox]

можно например хранить массив значений и добавлять/удалять оттуда эти значения при клике

var values = [];

$("#workDesign label").on("click", function(){
        var input = $(this).children("input");
        var tag = $(this).text();
        var i = values.indexOf(tag);
        if (input.prop("checked"))  {
            input.parent().addClass("selected");
            if (i==-1) values.push(tag);
            //alert(tag);
        } else {
            if (i>-1) values.splice(i, 1);
            input.parent().removeClass("selected");
        }
        $("#workDesignTags").val(values.join(", "));
    });

codepen.io/anon/pen/xVpGda

пришлось проверять каждый раз наличие/отсутствие значения в массиве, т.к. почему-то событие при одном клике вызывается два раза.
надеюсь понял правильно

Comments

[Василий Белкин]

Спасибо огромное, очень долго искал решение!
Даже специально здесь зарегистрировался что-бы лайк поставить)