Using column search with fixedHeader and fixedColumns for dynamic built tables

yishayh

Hi,

We have a datatable which has dynamic columns according to the first request from the server.
This datatable has both fixedHeader and fixedColumns and We want to add to it column search capabilities.
A few question:
1. When We tried rendering the inputs after the table was rendered the fixedColumns cast over the inputs.
When should the event be run in case the columns are dynamic? What should be the causing event after which the logic for rendering the filter inputs should be run?
2. The input appears as "read only" when we added it to the fixedHeader (we did so using the attached code).

var thead = $('#' + tableId).closest(".dataTables_scroll").find(".dataTables_scrollHeadInner table thead");
      thead.append(angular.element('<tr class="filters"/>'));
      thead.find("th").each( function () {
        var title = $(this).text();
        var filters = $(this).closest("thead").find(".filters");
        var el = angular.element('<th><input type="text" placeholder="' + $translate.instant("SEARCH") + ' ' + title + '" /></th>' );
        filters.append(el);
      } );

      // DataTable
      var table = $('#' + tableId).DataTable();

      // Apply the search
      table.columns().every( function () {
        var that = this;

        $( 'input', this.header() ).on( 'keyup change', function () {
          if ( that.search() !== this.value ) {
            that
                .search( this.value )
                .draw();
          }
        } );
      } );

Many thanks,
Yishay
This also related to this question:
https://datatables.net/forums/discussion/35241/best-practice-using-column-searching-with-fixedheader-fixedcolumns?new=1