mdbootstrap / mdb-react-ui-kit

React 18 & Bootstrap 5 & Material Design 2.0 UI KIT
https://mdbootstrap.com/docs/b5/react/
Other
1.41k stars 264 forks source link

how to add badge on a data in datatable #77

Closed remolalata closed 5 years ago

remolalata commented 5 years ago

Hi, I want to add a badge on my data on a datatable but when I'm using the Badge to style the data instead of showing the data its displaying the ticket.ticket_status

here is my code

const assembledTickets = props.tickets.map((ticket) => {
    return (
        {
            ticket_id: ticket.ticket_id,
            ticket_summary: ticket.ticket_summary,
            duedate: ticket.duedate,
            orignal_duedate: ticket.original_duedate,
            logged_time: ticket.logged_time,
            ticket_status: <MDBBadge color="primary">ticket.ticket_status</MDBBadge>
        }
    )
});

const data = {
    columns: [
        {
            label: 'Ticket ID',
            field: 'ticet_id'
        },
        {
            label: 'Summary',
            field: 'ticket_summary'
        },
        {
            label: 'Duedate',
            field: 'duedate'
        },
        {
            label: 'Original Duedate',
            field: 'orignal_duedate'
        },
        {
            label: 'Logged Time',
            field: 'logged_time'
        },
        {
            label: 'Status',
            field: 'ticket_status'
        }
    ],
    rows: assembledTickets
}

return (
    <MDBDataTable striped bordered data={data} />
)
Kordrad commented 5 years ago

Hi @remolalata ,

write ticket.ticket_status like this {ticket.ticket_status}