Topic: MDBDatatable
asifyali free asked 5 years ago
My <th> classes are getting stripped off pl see below
<th class="">Date<i class="fa fa-sort float-right" aria-hidden="true"></i></th>
whereas the example has all these classes which i need.
<th class="th-sm sorting_desc" tabindex="0" aria-controls="dtBasicExample" rowspan="1" colspan="1" aria-label="Name
: activate to sort column ascending" style="width: 138px;" aria-sort="descending">Name
<i class="fa fa-sort float-right" aria-hidden="true"></i>
</th>
I have no control over <th as i am declaring the datatable as:
Grzegorz Bujański staff answered 1 year ago
To use dropdown in datatable try this data:
const actionData = {
columns: [
{ label: 'Name', field: 'name' },
{ label: 'Position', field: 'position' },
{ label: 'Office', field: 'office' },
{ label: 'Contact', field: 'contact', sort: false },
],
rows: [
{
name: 'Tiger Nixon',
position: 'System Architect',
office: 'Edinburgh',
phone: '+48000000000',
email: 'tiger.nixon@gmail.com',
},
].map((row) => {
return {
...row,
contact: (
<>
<MDBDropdown>
<MDBDropdownToggle>Dropdown button</MDBDropdownToggle>
<MDBDropdownMenu appendToBody="true">
<MDBDropdownItem link>Action</MDBDropdownItem>
<MDBDropdownItem link>Another action</MDBDropdownItem>
<MDBDropdownItem link>Something else here</MDBDropdownItem>
</MDBDropdownMenu>
</MDBDropdown>
</>
),
};
}),
};
The most important thing is to use the appendToBody
prop to make the dropdown display properly.
Shashank Tiwari free answered 4 years ago
Q.1 I want to ask that how we put search box at every column. Q. 2 How to change Position and CSS of Footer elements. I am naive in this please give me a proper way to do this.
Jakub Chmura staff commented 4 years ago
I need to redirect you to your thread. https://mdbootstrap.com/support/react/how-to-get-search-box-at-every-column-in-datatable/
Jakub Mandra staff answered 5 years ago
Hey, thanks for posting.
That brings the problem out - we should add attributes for table components, so they would be more controllable and customizable.
Unfortunately, for now it is not possible to add your custom attributes.
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- ForumUser: Free
- Premium support: No
- Technology: MDB React
- MDB Version: 4.8.4
- Device: Web
- Browser: Chrome
- OS: Windows
- Provided sample code: No
- Provided link: No
arjun Liqotech free commented 1 year ago
how to add a dropdown on the col in the table ?