jquery bootstrap selectpicker基于先前列表选择的刷新列表

我有三个下拉列表，一个列表在页面加载时填充，不会更改。 第2和第3列表可能会根据选择而改变。 此function工作正常。

我已经尝试将Bootstrap selectpicker添加到选择器中，我可以看到它正在工作 – 遗憾的是列表根据选择没有刷新。 我实际上认为“幕后”他们是我可以看到传递的查询，但通过前端没有任何反应。

部分HTML：

前两个DDL是通过php创建的但是

我有以下Javascript：

 $(document).ready(function() { $(".selectpicker").selectpicker(); }); 

这是我发现问题的地方，我试图在ajax中对变更函数实现这一点而没有成功 – 甚至不确定它是否正确。

 $('.selectpicker').selectpicker('refresh'); 

我对这一切都很陌生，所以想要一些帮助。

Answer 1

在遇到同样的问题后我找到了你的问题。 添加$('.selectpicker').selectpicker('refresh'); 在将项目添加到我的列表之后完成了这项工作。
所以你可能需要找到正确的位置。 也许在你的ajax电话的成功部分。

Answer 2

从我迄今为止的经验中我所理解的 –

如果要在下拉列表中添加动态选项，则必须在添加选项之前调用以下函数

 $(".selectpicker").selectpicker(); 

一旦你完成添加选项，然后调用下面的函数（如果你使用ajax添加选项，然后将此function成功部分，因为刚刚回答了Athina）

 $('.selectpicker').selectpicker('refresh'); 

如果您遇到任何奇怪的问题，例如显示下拉列表而不是数据或某些时候下拉列表没有正确显示那么肯定你一定是在放置函数而没有别的错误。

Answer 3

隐藏时更改selectpicker类名称：

刷新时：

 $('.selectpicker_oncreate').selectpicker('refresh'); 

Answer 4

在我的Ajax successCallBack中，我试图操作下拉列表，其id为reasonCode，基于dynamicId（值从服务器获取），如下所示：

 $('#reasonCode option[value='+dynamicId+']').prop('selected', true); 

但不幸的是，直到我在此之后添加了另一行，这才起作用，如下所示：

 $('#reasonCode').selectpicker('refresh'); 

Answer 5

如果刷新方法没有帮助，请尝试添加一些延迟。

  setTimeout(() => { jQuery('.selectpicker').selectpicker('refresh'); }, 500);