0

I have used clarity UI in my project and i have come across an issue where i want to select the row which is currently added to the clr-datagrid table .I've used clr-DgSelected directive and it gives me a select checkbox which i don't need and if i use [(clrDgSingleSelected)]="selectedUser" this will give me a radio option and it lets me to select the particular column with the radio option checked but the problem is not the radio button or checkbox i just want to highlight the newly added row how i can achieve this.

Any help would be appreciated Thank You

nethra gowda
  • 290
  • 1
  • 4
  • 23
  • Clarity's datagrid doesn't have a specific option to "add" rows, so what do you mean by "newly added"? Could you post an example of what you're trying to do, maybe on a plunker? Because as is, your question is hard to answer without any context. – Eudes Jan 16 '18 at 13:26
  • Questions without code make it hard to help. You probably need to manage it yourself, by adding a custom property on each record that you want to show as highlighted, and in the HTML you add a css to `clr-dg-row`if the record calls for it. – Ruan Mendes Jan 17 '18 at 21:24

1 Answers1

2

Since Clarity doesn't have the concept of a newly added row, you need to add that concept yourself. Each record could have a isNew or showHighlight property that would allow you to add a CSS class that will highlight it

<clr-dg-row *ngFor="let user of users" [class.highlight]="user.isNew">
    <clr-dg-cell>{{user.id}}</clr-dg-cell>
    <clr-dg-cell>{{user.name}}</clr-dg-cell>
    <clr-dg-cell>{{user.creation | date}}</clr-dg-cell>
    <clr-dg-cell>{{user.color}}</clr-dg-cell>
</clr-dg-row>
Ruan Mendes
  • 90,375
  • 31
  • 153
  • 217