​

const columns = [

  { label: 'Address', field: 'address' },

  { label: 'Company', field: 'company' },

  { label: 'Email', field: 'email' },

  { label: 'Name', field: 'name' },

  { label: 'Phone', field: 'phone' },

  { label: 'Username', field: 'username' },

  { label: 'Website', field: 'website' },

];

​

const asyncTable = new mdb.Datatable(

  document.getElementById('datatable'),

  { columns, },

  { loading: true }

);

​

fetch('https://jsonplaceholder.typicode.com/users')

  .then((response) => response.json())

  .then((data) => {

    asyncTable.update(

      {

        rows: data.map((user) => ({

          ...user,

          address: `${user.address.city}, ${user.address.street}`,

          company: user.company.name,

        })),

      },

      { loading: false, entriesOptions: [2, 10, 25] }

    );

  });