Kibana 4.6 - How to make header position fixed in Data table?

Elastic Stack Kibana
1

Hey,

I am creating a plugin to have "header position fixed" in Data table .

In order to do that -

I added a id ("header_dash_fixed_pos") in file - src/ui/public/doc_table/doc_table.html

(line 6)
  1. In plugin folder - index.js file

module.exports = function(kibana) {
return new kibana.Plugin({
uiExports: {
visTypes: ['plugins/kbn-data-table-fixed-header/fixed-position_new']
}
});
};

  1. in fixed-position_new.js file

define(function(require) {
require('jquery');

require(["plugins/kbn-data-table-fixed-header/jquery.floatThead"], function() {
var $table = $('table#header_dash_fixed_pos'); // NOT WORKING
$table.floatThead(); / // NOT WORKING
});

});

Somehow these 2 lines not executing.

var $table = $('table#header_dash_fixed_pos');
$table.floatThead();

and as result i don't see fixed header.

However when i put this code in console of the browser it start working.

I am not sure where i am making mistake. It looks like either src/ui/public/doc_table/doc_table.html this file is not loading first or my file loading first.

How to fix this issue.

I am very new to plugin development. Now sure what else to do.

Thanks in advance.