This example demonstrates the workflow functionalities that defines the flow of transition between the columns. You can drag and drop the cards between Kanban columns to see the workflow restriction.
Order - 4 items | Ready to Serve - 4 items | Home Delivery - 4 items | Delivered - 5 items |
|---|
Mexican Green Wave Stromboli sandwich with chili sauce.  Fresh Veggie Veggie with Onions and Capsicum.  Chicken Golden Delight Barbeque chicken with a topping of golden corn loaded with extra cheese.  Cheese and Corn Cheese with golden corn.  | Peppy Paneer It's made using toppings of tomato, mozzarella cheese and fresh basil.  Pepper Barbecue Chicken Pepper Barbecue Chicken with cheese.  Chicken Sausage Chicken Sausage with cheese.  Chicken Tikka Tandoori masala with Chicken Tikka, Onion, red paprika and mint.  | Margherita Lebanese Pizza topped with tomato sauce.  Pepper Barbecue and Onion Pepper Barbecue chicken with Onion.  Veggie Paradise Veggie Delight with Goldern Corn, Black Olives, Capsicum and red Paprika.  Chicken Dominator Double Pepper Barbecue Chicken with Peri-Peri Chicken, Chicken Tikka, Grilled and Rashers.  | Indian Tandoori Paneer Tandoori Paneer with capsicum, red paprika and mint.  Chicken Fiesta Grilled Chicken Rashers with Peri-Peri chicken, Onion and Capsicum.  Double Cheese Margherita Margherita with chili sauce and double Cheese.  Deluxe Veggie Onions and Capsicum those delectable mushrooms with paneer and golden corn to top it all.  Veg Extravanganza Pizza with corn, olives, onions, capsicum, tomatoes and jalapeno with cheese to go all around.  |
Description
In this sample, you can drag the cards from the `Order` column and drop them into `Ready to Serve` and `Home Delivery` columns. Also, you couldn’t drag the cards from the `Delivered` column and drop the cards in the `Order` column. The action is controlled using the below properties.
- The
transitionColumnsproperty is used to allow the card transition to specified columns. - The
allowDragproperty is used to enable/disable the drag action of columns. - The
allowDropproperty is used to enable/disable the drop action of columns.