datagrid

how to make the last column pinned to right

7 Replies

Hi @saji_nael. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:

kapa.ai•2y ago

---------------------- To pin the last column to the right in a table using refine and Ant Design, you can set the fixed prop to "right" for the last <Table.Column> in your table. Here's an example from the extracted information:

<Table.Column<ICampaign>
  fixed="right"
  title="Actions"
  dataIndex="actions"
  render={(_, { id }) => <EditButton recordItemId={id} />}
/>

<Table.Column<ICampaign>
  fixed="right"
  title="Actions"
  dataIndex="actions"
  render={(_, { id }) => <EditButton recordItemId={id} />}
/>

In this example, the last column with the title "Actions" is fixed to the right. You can apply the same fixed="right" prop to the last column in your table to achieve the desired effect. Source: Migrating a React-Admin Application to refine (https://refine.dev/blog/migrating-a-react-admin-application-to-refine) ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------

Migrating a React-Admin Application to refine | refine

Recently, our team decided to migrate a B2B admin panel of one of our customers from React-Admin to refine to battle test our new framework and improve our productivity.

kapa.ai•2y ago

<@1000087684632547538> kapa.ai is still learning and improving, please let us how it did by reacting below

foreign-sapphire•2y ago

This is not a case of refine concern. Check out which UI Framework you are using.

adverse-sapphireOP•2y ago

material ui i did and I see the original datagrid has attr pinnedColumns that is not exist in datagrid refine

foreign-sapphire•2y ago

foreign-sapphire•2y ago

You can try here.

datagrid

Did you find this page helpful?