Select2 库在其他 HTML 表单中运行良好,但在此表单中不起作用 我想使用 select2 过滤器在我的动态表单中实现搜索选项,但它不起作用请帮助...
头部标签
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link rel="stylesheet" type="text/css" href="select2/dist/css/select2.min.css">
<script src="jquery-3.3.1.min.js" type="text/javascript"></script>
<!-- Select2 JS -->
<script src="select2/dist/js/select2.min.js" type="text/javascript"></script>
在靠近第一个选择标签的这个表单中我想要选择2
<div>
<table class="table table-bordered" id="item_table">
<tr>
<th>Firm Name</th>
<th>Gross</th>
<th>Tax</th>
<th>Net</th>
<th><button type="button" name="add" class="btn btn-success btn-sm add"><span class="glyphicon glyphicon-plus"></span></button></th>
</tr>
</table>
<div align="center">
<input type="submit" name="submit" class="btn btn-info" value="Submit" />
</div>
</div>
</form>
<script>
$(document).ready(function(){
$(document).on('click', '.add', function(){
var html = '';
html += '<tr>';
html += `<td><select type="text" name="head[]" class="inst_amount"><option value="">Select Name</option><?php $sql=mysqli_query($con,"SELECT * FROM bank order by name");
while($row=mysqli_fetch_array($sql))
{?><option value="<?php echo htmlentities($row['id']);?>"><?php echo htmlentities($row['Name']);?></option><?php }?></select></td>`;
html += '<td><input type="text" name="invoice_no[]" class="form-control amount1" /></td>';
html += '<td><button type="button" name="remove" class="btn btn-danger btn-sm remove"><span class="glyphicon glyphicon-minus"></span></button></td></tr>';
$('#item_table').append(html);
});
$(document).on('click', '.remove', function(){
$(this).closest('tr').remove();
});
$('#insert_form').on('submit', function(event){
event.preventDefault();
var error = '';
var form_data = $(this).serialize();
if(error == '')
{
$.ajax({
url:"insert.php",
method:"POST",
data:form_data,
success:function(result)
{
window.location.href="print.php?id="+result;
}
}
);
}
else
{
$('#error').html('<div class="alert alert-danger">'+error+'</div>');
}
});
});
</script>
这里我使用的是 select2 过滤器
<script src="jquery-3.3.1.min.js" type="text/javascript"></script>
<!-- Select2 JS -->
<script src="select2/dist/js/select2.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
console.log($('.inst_amount').length)
$('.inst_amount').select2();
});
</script>
由于我是编码新手,请帮助我解决这个问题。