javascript - data-live-search="true" 不适用于多个条目,但适用于第一个条目
问题描述
单击“插入”按钮时,我需要一次为同一字段存储多个数据。这里data-live-search
适用于第一个条目。当我添加下一个“行”时,data-live-search
它不起作用。
表单的 Html 代码如下
<form action="{{ route('store') }}" method="POST" enctype="multipart/form-data">
@csrf
<div id="fields">
</div>
<div class="row">
<div class="col-md-3 form-group">
<select class="form-control" name="company[]" class="selectpicker" data-live-search="true" id="selectcompany">
<option selected disabled>Select Company</option>
@foreach($getcompany as $company)
<option value="{{ $company->id }}">{{ Str::limit($company->name, 100) }}</option>
@endforeach
</select>
</div>
<div class="input-group">
<div class="input-group-btn">
<button class="btn btn-success" type="button" onclick="fields();"> <span class="glyphicon glyphicon-plus" aria-hidden="true"></span> </button>
</div>
</div>
</div>
<button type="submit" class="btn btn-success insert btn-lg" id="button">Insert</button>
</form>
这是JavaScript
<script>
var room = 1;
function fields() {
room++;
var objTo = document.getElementById('fields')
var divtest = document.createElement("div");
divtest.setAttribute("class", "form-group removeclass"+room);
var rdiv = 'removeclass'+room;
divtest.innerHTML = '<div class="row"><div class="col-md-3 form-group"><select class="form-control" name="company[]" class="selectpicker" data-live-search="true" id="selectcompany"><option selected disabled>Select Company</option>@foreach($getcompany as $company)<option value="{{ $company->id }}">{{ Str::limit($company->name, 100) }}</option>@endforeach</select></div><div class="input-group-btn"> <button class="btn btn-danger" type="button" onclick="remove_fields('+ room +');"> <span class="glyphicon glyphicon-minus" aria-hidden="true"></span> </button></div></div></div>';
objTo.appendChild(divtest)
}
function remove_fields(rid) {
$('.removeclass'+rid).remove();
}
</script>
解决方案
推荐阅读
- java - 在尝试使复合类方法对另一个包类可见时避免违反 SOLID 原则
- cassandra - 如何在没有分区键的情况下使用 ORDER_BY 搜索记录
- html - IE/Edge 不考虑绝对底部
- javascript - 有没有办法将事件监听器添加到类中?
- ios - UIAlertController 没有立即显示
- spring - 页面加载时的 Spring MVC 表单验证
- h2o - 可以为 h2o.save_model() 设置文件名(而不是简单地使用 model_id 值)?
- javascript - 谷歌地图标记没有显示 javascript
- node.js - Amazon Web Services 上的连接被拒绝
- c# - 了解为什么在 Bot Builder Framework 示例中似乎进行了 3 次翻译:MultiLingualBot