bootstrap获取下拉框数据_Bootstrap Table 在指定列中添加下拉框控件并获取所选值...

背景

最近在使用Bootstrap table ，有一个在某一列添加一个下拉列表，并且通过 “getAllSelections”方法获取所选行的需求，在实现这个功能的时，走了一些弯路，遇到了一些坑。所以今天总结出来，既是自己的学习，也分享给大家，希望能够有些帮助。

如何解决

添加这个下拉列表有以下两种方法：

利用Column options 中的 formatter 将数据转换成下拉列表的形式

使用bootstrap-table拓展中的editable插件

这次主要介绍第一种，基本的思路为：首先通过 bootstrap-table 的Column 配置项中的formatter，将获取到的数据转换为包含数据的 select 控件。然后根据用户选择项更新对应单元格数据，最后通过getallselection方法获取所选行数据。

formatter，其配置项为function，有三个参数：(value,row,index)

到这里，下拉列表已经可以显示出来了，但是如果直接使用 getallselection 方法获取所选内容会有问题：获取到的数据是默认表格初始化加载的内容，并不是重新选择的内容。

bootstrap-table是一个jQuery插件，直接在html上面修改是获取不到的，要修改需要通过它自己的方法。bootstrap-table 在Methods 中提供了一个updateCell的方法。

updateCell ，包含了三个参数(index,field,value),在某一行的某一列更新value。

events

完成了下拉列表的显示，有了更新单元格