We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Change single card properties (like border color) on the fly with run-time code

I am trying to set some logic behind the scenes after the kanban board has been created. I want to basically find a card and change its border color to say "Red" based on some logic. So I databind the board, then as time goes by one of cards is given a certain tag of urgent or a request comes from the server that dictates a change in one of the cards appearance. I then want to change the border of that card to red. I can't seem to find a way to go in and manipulate 1 card at a time. So essentially I'm looking for some sort of collection of cards to manipulate.

Is this possible? Maybe I am trying to go about it the wrong way? Thank you.

3 Replies

SG Sridharan Gajendran Syncfusion Team May 15, 2017 01:03 PM UTC

Hi Richard, 
Thanks for contacting Syncfusion Support. 
We are able to achieve your requirements by setting IndicatorColorPalette property and applying custom card template using CardTemplate property in Kanban.  Please refer below code sample for setting IndicatorColorPalette property in Kanban. 
Code sample: 
<!--Color mapped to priority--> 
      <kanban:ColorMapping Color="#FFECB93C" Key="Urgent"></kanban:ColorMapping> 
      <kanban:ColorMapping Color="LightGray" Key="Default"></kanban:ColorMapping> 
Key for the card can be defined as like in the below code sample. 
//Record in the ItemsSource collection. 
KanbanModel task = new KanbanModel(); 
//Color key in the Kanban Model is used to set the priority for the task. 
task.ColorKey = "Urgent"; 
Please refer demo sample with custom card template from the below link. 

RB Richard Buffington May 15, 2017 04:10 PM UTC


Thank you for the response. I now understand the color coding. However, how would I find a particular card at runtime to change this on the fly? OR, am I supposed to update the datasource (changing the model field for the record I want to change to a different ColorKey) which in-turn the Kanban control then updates the card dynamically?

SG Sridharan Gajendran Syncfusion Team May 16, 2017 09:56 AM UTC

Hi Richard, 
Thanks for the update. 
By having the ItemsSource bound item, we can get it’s corresponding card by iterating KanbanColumn’s Cards collection and compare the item with Card’s Content property. Then we have updated the Kanban Card’s border color based change in the indication color key through work around.  
Please find the demo sample from the following link. 
Sample: GettingStarted 

Live Chat Icon For mobile
Up arrow icon