J'essaie de créer une entrée personnalisée qui affichera plusieurs sélections dans une entrée. Je l'ai partiellement fonctionné, mais je n'arrive pas à comprendre comment afficher plusieurs valeurs dans l'entrée proposal-type
. Quoi que je choisisse, il ne montre que la valeur de A. Ensuite, si plusieurs sélections sont choisies, elles n'apparaissent pas.Comment obtenir des valeurs à partir des sélections de cases à cocher dans une entrée de texte
Est-ce que quelqu'un voit ce que je fais mal?
$('#proposal-type').click(function() {
$('#proposal-type-drop').addClass('active');
});
$('.drop-item-input').on('change', function() {
var typeVal = $('.drop-item-input').val();
$('.drop-item-input').each(function() {
if ($(this).is(":checked")) {
console.log(typeVal);
$('#proposal-type').val(typeVal).text(typeVal);
};
});
});
#proposal-type-drop {
\t width: 45%;
\t display: none;
\t position: absolute;
}
#proposal-type-drop.active {
\t background: rgba(0,0,0,1);
\t display: block;
\t height: auto;
\t z-index: 1;
}
.drop-item {
\t color: #FFF;
\t font-size: .9rem;
\t padding: 5px;
\t background: #000;
\t display: block;
\t width: 100%;
\t cursor: pointer;
}
.drop-item-input {
\t display: none;
}
.proposal-text {
\t width: 95%;
\t display: block;
\t height: 6em;
\t margin: 1.5% 2% 2.5% 2%; !important
}
#proposal-check {
\t display: none;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="panel-input">
<input type="text" id="proposal-type" name="proposal_type" class="proposal-input" placeholder="Selection">
<div id="proposal-type-drop">
<label class="drop-item">A<input type="checkbox" class="drop-item-input" value="A"></label>
<label class="drop-item">B<input type="checkbox" class="drop-item-input" value="B"></label>
<label class="drop-item">C<input type="checkbox" class="drop-item-input" value="C"></label>
</div>
</div>
'var typeVal = $ (» drop-item-entrée. ') Val();. 'Recherches les premier' .drop -item-input ', mais vous avez besoin d'une entrée courante, alors changez-la en var varVal = $ (this) .val(); ' puis dans chaque callback concaténez toutes les valeurs:' typeVal + = $ (this) .val() ' – rie