<div class="input-group form-group">
<span class="input-group-addon no-border no-padding">Model*</span>
<input type="tel" id="model" class="form-control no-border no-padding">
<a role="button" data-toggle="collapse" href="#list" aria-expanded="false" aria-controls="list"><span class="arrow"></span></a>
<ul id="list" class="group collapse " data-toggle="collapse" >
<li class="list-group-item list-group-parent">Freeflow
<ul class="list-group">
<li class="list-group-item">Excursion</li>
<li class="list-group-item">Monterey</li>
<li class="list-group-item">Aptos</li>
<li class="list-group-item">Azure</li>
<li class="list-group-item">Tristar</li>
<li class="list-group-item">Cascina</li>
<li class="list-group-item">Mini</li>
</ul>
</li>
<li class="list-group-item list-group-parent">Freeflow
<ul class="list-group">
<li class="list-group-item">Excursion</li>
<li class="list-group-item">Monterey</li>
<li class="list-group-item">Aptos</li>
<li class="list-group-item">Azure</li>
<li class="list-group-item">Tristar</li>
</ul>
</li>
<li class="list-group-item list-group-parent" value="Freeflow">Freeflow
<ul class="list-group">
<li class="list-group-item">Excursion</li>
<li class="list-group-item">Monterey</li>
<li class="list-group-item">Aptos</li>
<li class="list-group-item">Azure</li>
<li class="list-group-item">Tristar</li>
</ul>
</li>
<li class="list-group-item list-group-parent">Freeflow
<ul class="list-group">
<li class="list-group-item">Excursion</li>
<li class="list-group-item">Monterey</li>
<li class="list-group-item">Aptos</li>
<li class="list-group-item">Azure</li>
<li class="list-group-item">Tristar</li>
<li class="list-group-item">Cascina</li>
<li class="list-group-item">Mini</li>
</ul>
</li>
</ul>
</div>
</div>
<div class="col-md-12">
<label for="comment" class="comment"><p>* Údaje sú povinné</p>
<span class="ask">Ak máte akekoľvek otázky, napíšte nám:</span></label>
<textarea class="form-control no-border" rows="5"></textarea>
</div>
<div class="col-md-4 col-xs-12">
<button type="submit" class="btn submit-btn">odoslať</button>
</div>
<div class="clearfix"></div>
</form>
</div>
</div>
</div>
</div>
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
<script>
$(document).on('click','.group.collapse',function(e) {
if( $(e.target).is('li') ) {
$(this).collapse('hide');
}
});
$('.list-group-item').click( function() {
var parentText = $(this).closest('.list-group-item').children('.list-group-parent').first().html();
var inputValue = parentText + " " + $(this).html();
$('#list').val(inputValue);
});
</script>
