javascript - 增加FooTable插件上过滤器搜索的宽度

我一直在寻找，似乎无法找到/弄清楚如何使“数据过滤器”搜索框更大。我想扩大范围，同时仍然保持对窗口大小调整的响应能力，这可能吗？我尝试过
filtering: [{ container: "#footableFilterBox", options: { style: { width: "75%" } } }]
但这在这里不适用或我的语法不正确吗？

我还尝试将css width直接添加到FooTable使用以下命令生成的input-group中:

$(document).load(function() {
  $('div#footableFilterBox').find('.input-group').css('width','75%');
});

但这似乎不起作用。我也尝试.addClass();并自定义自己的CSS，但这也不起作用。

谁有想法？这将对我的页面布局大有帮助。提前致谢!

更新

这是用于初始化FooTable插件的代码。它位于我的HTML页面的底部。我在Rails应用程序中使用它，但是imo并没有太大的区别。

<script type="text/javascript">

jQuery(function($) {

  $('#propertiesTable').footable({
      filtering: [{
          container: "#footableFilterBox"
      }]
  });

});

</script>

有效的代码

基于@gaetanoM的答案，我能够使用jQuery Tree Traversal导航我的方式来查找所需的元素。代码如下:

$('#propertiesTable').on('postinit.ft.table', function(e, ft) {
    $(this).closest('.clients-list').siblings('#footableFilterBox').find('.footable-filtering-search, .input-group').css('width','100%');
  }).footable();

感谢您提供的所有答案!

最佳答案

您可以使用:

$('.table').on('postinit.ft.table', function(e, ft) {
  $(this).find('.footable-filtering-search .input-group').css('width','75%')
}).footable();

fiddle。

关于javascript - 增加FooTable插件上过滤器搜索的宽度，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/45536864/