J版OpenStack text框回车(enter)实现table Filter功能(替代筛选button功能)

J版OpenStack  text框回车(enter)实现table Filter功能


首先,我们需要知道table的filter代码在哪儿?

在/usr/lib/python2.7/site-packages/horizon/templates/horizon/common/_data_table_table_actions.html

这个就是每个table头上的filter


图中红色框内包含了一个bootstrap的text形式的输入和一个button,展示即为:


现在我们要实现的就是在筛选框内输入筛选内容,直接回车实现筛选,并干掉button "筛选"(--用户体验--)


实现代码:

1.在

中加入js方法


2.在


中加入button name属性


1和2是基本的js修改,保证button name对应,style="display:none;"即为隐藏button "筛选"


以上就实现了我们要的功能

ps:button中{{ filter.attr_string|safe }} 其实就是一个class和一个id,以project下虚拟机为例,{{ filter.attr_string|safe }}即为

   class="btn btn-default btn-sm"  id="instance_action_filter"

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值