如何在输入字段中填充选定的值
如何在输入字段中填充选定的值
提问于 2019-04-05 00:51:51
我有一个带有输入字段的引导下拉列表，我的下拉列表由复选框组成，可以选择多个值。
我要做的是，当用户检查任何下拉列表时，应该在输入字段中填充逗号分隔符，以便用户可以选择多个用户。
和我想做的棘手的部分是
-in我的下拉列表，现在我有三个下拉列表，它们有不同的值和文本。
- 这些是文本：
dheeraj值：draj.121@gmail.com等等。 - 因此，我显示文本为
dheeraj，但当用户单击用户时，我希望使用draj.121@gmail.com填充输入字段，这是该下拉列表的值。
$(".checkbox-menu").on("change", "input[type='checkbox']", function() {
$(this).closest("li").toggleClass("active", this.checked);
});
$(document).on('click', '.allow-focus', function(e) {
e.stopPropagation();
});<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/css/bootstrap.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/js/bootstrap.min.js"></script>
<div class="form-group col-xs-6 col-sm-6 col-md-6 col-lg-3">
<label for="subCategoryCode">TO :</label>
<div class="input-group">
<input type="text" class="form-control" aria-label="Text input with dropdown button" name="To" id="To">
<div class="input-group-append">
<button class="btn btn-outline-secondary dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"></button>
<ul class="dropdown-menu checkbox-menu allow-focus" aria-labelledby="dropdownMenu1">
<li><label> <input type="checkbox"
value="draj.121@gmail.com"> Dheeraj
</label></li>
<li><label> <input type="checkbox"
value="raju.45@gmail.com"> Raju
</label></li>
<li><label> <input type="checkbox"
value="ravi456@gmail.com"> Ravi
</label></li>
</ul>
</div>
</div>
</div>此外，当用户取消选中复选框时，我希望从输入字段中删除该值。
请给我一些想法，谢谢
回答 1
Stack Overflow用户
回答已采纳
发布于 2019-04-05 01:16:17
您需要循环遍历复选框，并将值附加到变量，并将其赋值给文本字段，如下所示
$(".checkbox-menu").on("change", "input[type='checkbox']", function() {
$(this).closest("li").toggleClass("active", this.checked);
var sList = "";
$('input[type=checkbox]').each(function () {
if(this.checked) {
sList += $(this).val() + ","
}
});
$("#To").val(sList.slice(0,-1));
});
$(document).on('click', '.allow-focus', function(e) {
e.stopPropagation();
});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/55531605
复制
相似问题
如何在输入字段中填充选定选项
根据选定的下拉列表填充输入字段值
用jquery填充选定选项的输入字段
使用ajax使用php mysql选定数据中的值填充输入字段
在输入字段中显示选定的对象值
添加站长 进交流群
领取专属 10元无门槛券
AI混元助手 在线答疑
关注 腾讯云开发者公众号
洞察 腾讯核心技术
剖析业界实践案例
腾讯云开发者
