2

Been fighting with ng-smart-table trying to find an elegant way to remove the Column Filter placeholder without overriding the javascript. I know i can modify node_modules the module within that directory but i need to modify this inside the component. Any ideas?

Here are my column settings. I've tried to modify the cell but nothing seems to override the placeholder which displays the name of the column.

public settings: any = {
    actions: false,
    noDataMessage: 'Loading... please wait!',
    filtering: {filterString: ''},
    className: ['table-striped', 'table-bordered'],
    columns: {
        customerName: {
          title: 'Account',
          class: 'topHeading',
        },
}
MizAkita
  • 1,115
  • 5
  • 21
  • 52

1 Answers1

1

I had the same problem just now and couldn't find any good workarounds posted anywhere. I ended up making the color of the placeholder the same color as the background of the input to "hide" the placeholder.

// Hide the placeholders in all browsers
.ng2-smart-filter input::-webkit-input-placeholder {
    /* WebKit browsers */
    color: #fff;
}

.ng2-smart-filter input::-moz-placeholder {
    /* Mozilla Firefox 4 to 18 */
    color: #fff;
}

.ng2-smart-filter input::-moz-placeholder {
    /* Mozilla Firefox 19+ */
    color: #fff;
}

.ng2-smart-filter input::-ms-input-placeholder {
    /* Internet Explorer 10+ */
    color: #fff;
}
Matthew Meppiel
  • 966
  • 3
  • 14
  • 29