Page 1 of 1

Globalfilter in datatable not working

Posted: 14 Jul 2019, 14:21
by debajitkiran
Hello Team,

I am trying to use Primereact datatable in spfx webpart (Typescript)

in the Class I am declaring datatable

Code: Select all

public dt: DataTable;
and inside the constructor I am initializing the same

Code: Select all

this.dt = new DataTable({});

Code: Select all

<DataTable
            ref={el => (this.dt = el)}
            value={this.state.projects}
            paginator={true}
            rows={10}
            header={searchHeader}
            globalFilter={this.state.globalFilter}
            emptyMessage="No records found"
          >
            <Column
              field="internalReference"
              header="Code"
              sortable={true}
            />
</DataTable>
In my render function has searchHeader as below

Code: Select all

render() {
    var searchHeader = (
      <div style={{ textAlign: "left" }}>
        <i className="pi pi-search" style={{ margin: "4px 4px 0 0" }} />
        <InputText
          type="search"
          onInput={e => this.setState({ globalFilter: e.currentTarget.value })}
          placeholder="Rechercher"
        />
      </div>
    );
    ....
}
Some help to find out the problem will be very much appreciated.