Hide Data Table Column

UI Components for React
Post Reply
Posts: 17
Joined: 31 Aug 2018, 12:55

19 Dec 2018, 13:28


Is there anyway I can hide a DataTable column but still have a DataTable globalFilter search within that column?

Thanks in advance

Posts: 536
Joined: 12 Sep 2017, 10:44

20 Dec 2018, 13:47

You can use 'style' prop for Column component, like the below code;

Code: Select all

        let header = <div style={{'textAlign':'left'}}>
                            		<i className="pi pi-search" style={{margin:'4px 4px 0 0'}}></i>
                           		 <InputText type="search" onInput={(e) => this.setState({globalFilter: e.target.value})} placeholder="Global Search" size="50"/>

Code: Select all

                    <DataTable globalFilter={this.state.globalFilter} value={this.state.cars} header={header}>
                        <Column field="vin" header="Vin"/>
                        <Column field="year" header="Year" />
                        <Column field="brand" header="Brand" />
                        <Column field="color" header="Color" style={{display:'none'}}/>

Post Reply

Return to “PrimeReact”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 1 guest