Добавление и удаление значения из input
Доброго времени суток! в JS не силен, поэтому обращаюсь за помощью к знатокам. Имеется форма в модальном окне, вне этой формы есть чекбоксы в виде <input><label><span>Название</span></label>, таких инпутов много, и при клике на него я забираю значение из span и добавляю его в невидимый input в форме через запятую.
Выглядит следующим образом: $('.hide-content label').click(function(){ $s = $(this).find('.name-sale').html(); $('.modal-dom #type-home').val($('.modal-dom #type-home').val() + $s + ","); }); Но не получается стирать из этого инпута то значение, которое добавил, при повторном клике на тот же инпут, пробовал использовать toggle, но почему-то он просто убирает и добавляет либо к спану, либо к тому невидимому инпуту display:none. Помогите, пожалуйста, как можно реализовать такую задачу? |
Hadouken,
идите циклом по всем input:checked и собирайте данные |
рони,
Это сначала мне нужно пройтись циклом по всему списку, и делать проверку на :checked или как? |
Цитата:
|
laimas,
Проблема, что в значении value, указано другое значение, которое используется для другой функции. И чтобы просто передать эти значения, нужна кнопка submit. |
Hadouken,
сделайте минимальный html |
<div class="container hide-content">
<form>
<div class="group">
<input class="sc-service-checkbox price_pick" id="check11" type="checkbox" value="2222">
<label for="check11">
<span class="name-sale">Значение 1</span>
<div class="price">
<span class="sc-service-price">2222</span>
</div>
</label>
</div>
<div class="group">
<input class="sc-service-checkbox price_pick" id="check12" type="checkbox" value="3333">
<label for="check12">
<span class="name-sale">Значение 2</span>
<div class="price">
<span class="sc-service-price">3333</span>
</div>
</label>
</div>
</form>
</div>
<div class="modal">
<form action="dom-iz-brusa-3" method="post">
<div class="modal--view__price">
<span class="modal--view__head">Выберите комплектацию</span>
<ul>
<li>
<input class="price_pick" id="srub-" type="radio" name="komplektaciya[]">
<label for="srub-">
<span class="name-sale">Значение 1</span>
<div class="price">
<span class="sc-service-price">Цена</span>
</div>
</label>
</li>
</ul>
<div class="row">
<input name="formid" type="hidden" value="Проект ">
<input type="hidden" id="type-home" value="">
<input class="btn" type="submit" name="proj-submit" value="Позвоните мне">
</div>
</form>
</div>
<script>
$('.hide-content label').click(function(){
$s = $(this).find('.name-sale').html();
$('.modal-dom #type-home').val($('.modal-dom #type-home').val() + $s + ",");
});
</script>
|
Hadouken,
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
</head>
<body>
<div class="container hide-content">
<form>
<div class="group">
<input class="sc-service-checkbox price_pick" id="check11" type="checkbox" value="2222">
<label for="check11">
<span class="name-sale">Значение 1</span>
<div class="price">
<span class="sc-service-price">2222</span>
</div>
</label>
</div>
<div class="group">
<input class="sc-service-checkbox price_pick" id="check12" type="checkbox" value="3333">
<label for="check12">
<span class="name-sale">Значение 2</span>
<div class="price">
<span class="sc-service-price">3333</span>
</div>
</label>
</div>
</form>
</div>
<div class="modal">
<form action="dom-iz-brusa-3" method="post">
<div class="modal--view__price">
<span class="modal--view__head">Выберите комплектацию</span>
<ul>
<li>
<input class="price_pick" id="srub-" type="radio" name="komplektaciya[]">
<label for="srub-">
<span class="name-sale">Значение 1</span>
<div class="price">
<span class="sc-service-price">Цена</span>
</div>
</label>
</li>
</ul>
<div class="row">
<input name="formid" type="hidden" value="Проект ">
<input id="type-home" value="тут будет значение checkbox">
<input class="btn" type="submit" name="proj-submit" value="Позвоните мне">
</div>
</div>
</form>
</div>
<script>
$('.hide-content input').change(function() {
var s = $.map($('.hide-content input:checked + label .name-sale'), function(el) {
return el.textContent
});
$('#type-home').val(s);
});
</script>
</body>
</html>
|
рони,
Блин, огромное спасибо) оказывается все так просто было |
| Часовой пояс GMT +3, время: 19:46. |