Foreign Key Field

[Kenney Phan]

Hi,

I have a KanBan component, but I need a KeyForeignField & KeyForeignValue to connect to a Foreign Key for the Field of the Kanban.

Something like this:

List Statuses = new List()

{

new Status ( statusId=0, statusName="Low" ),

new Status ( statusId=1, statusName="Medium" ),

new Status ( statusId=2, statusName="High" )

};

List< Task > Tasks = new List< Task >()

{

new Task ( id =0, statusName=0 ),

new Task ( id =1, statusName=2 ),

};

public class Task

{

int id;

int status;

}

public class Status

{

int statusId;

string statusName;

}

// Where Task.status is a Foreign key to Status.statusId

<SfKanban TValue="Task" KeyField=@nameof(Task.status) KeyForeignField=@nameof(Status.statusId) KeyForeignValue=@nameof(Status.statusName) ForeignDataSource=@Statuses />

How do a ForeignKey relationship in Kanban?

Thank u

[Gunasekar Kuppusamy]

Hi Kenney,

Currently we are validating you reported query from our end. We will update further details within two business days on or before 28^th September.

Regards,

Gunasekar

[Gunasekar Kuppusamy]

Hi Kenny.

Thanks for the patience.

We have further validated your reported requirement from our end.

By current Kanban behavior, it does not support the Foreign key field. Alternatively, we suggest that you, combine the two DataSource lists and assign it to the Kanban DataSource property.

We have prepared a sample for your reference. In this sample we have done the following things

• Task1 and Tasks2 is the difference lists. Id in the Tasks1Model is the foreign key of StatusId in the Tasks2Model.
• On OnInitialized method, we have merged the lists and assigned to the Kanban DataSource property.

Code snippets:

<SfKanban @ref="kanbanObj"  TValue="TasksModel" KeyField="Status" DataSource="@DataSource">

    <KanbanEvents TValue="TasksModel" ></KanbanEvents>

    <KanbanColumns>

        <KanbanColumn HeaderText="Backlog" KeyField="@(new List<string>() {"Open"})"></KanbanColumn>

        <KanbanColumn HeaderText="In Progress" KeyField="@(new List<string>() {"InProgress"})"></KanbanColumn>

        <KanbanColumn HeaderText="Testing" KeyField="@(new List<string>() {"Testing"})"></KanbanColumn>

        <KanbanColumn HeaderText="Done" KeyField="@(new List<string>() {"Close"})"></KanbanColumn>

    </KanbanColumns>

    <KanbanCardSettings HeaderField="Id" ContentField="Summary"></KanbanCardSettings>

    <KanbanSwimlaneSettings KeyField="Assignee" TextField="Assignee" SortDirection="SortDirection.Ascending"></KanbanSwimlaneSettings>

</SfKanban>

@code {

    SfKanban<TasksModel> kanbanObj;

    public List<TasksModel> DataSource = new List<TasksModel>() { };

    public class TasksModel

    {

        public int Id { get; set; }

        public string Title { get; set; }

        public string Status { get; set; }

        public int TaskId { get; set; }

        public string Summary { get; set; }

        public string Assignee { get; set; }

    }

    public void OnSorting(SwimlaneSortEventArgs args)

    {

       args.SwimlaneRows = args.SwimlaneRows.OrderBy(a =>

       DateTime.Parse(a.KeyField)).ToList();

    }

    public class Tasks1Model

    {

        public int Id { get; set; }

        public string Status { get; set; }

    }

    public class Tasks2Model

    {

        public int Id { get; set; }

        public int StatusId { get; set; }

        public string Assignee { get; set; }

        public string Summary { get; set; }

    }

    public List<TasksModel> cards;

    protected override void OnInitialized()

    {

        var cards = Tasks1.GroupJoin(Tasks2,

         c => c.Id,

         b => b.StatusId,

         (c, b) => new TasksModel

         {

             Id = c.Id,

             Status = c.Status,

             Assignee = b.Select(x => x.Assignee).FirstOrDefault(),

             Summary = b.Select(x => x.Summary).FirstOrDefault()

         });

        List<TasksModel> selectedCollection = cards.ToList();

        DataSource = selectedCollection;

    }

    public List<Tasks1Model> Tasks1 = new List<Tasks1Model>()

    {

        new Tasks1Model { Id = 1,  Status = "Open" },

        new Tasks1Model { Id = 2,  Status = "Open" },

        new Tasks1Model { Id = 3,  Status = "Testing" },

        new Tasks1Model { Id = 4,  Status = "Testing" },

        new Tasks1Model { Id = 5,  Status = "Testing" },

    };

    public List<Tasks2Model> Tasks2 = new List<Tasks2Model>()

    {

        new Tasks2Model { Id = 11, StatusId = 1, Summary = "Open summary", Assignee= "Andrew" },

        new Tasks2Model { Id = 12, StatusId = 2, Summary = "Open a card", Assignee= "Andrew" },

        new Tasks2Model { Id = 13, StatusId = 3, Summary = "Open a card", Assignee= "Andrew" },

        new Tasks2Model { Id = 14, StatusId = 4, Summary = "Open a card", Assignee= "Nancy" },

        new Tasks2Model { Id = 15, StatusId = 5, Summary = "Open a card", Assignee= "Nancy" },

    };

}

Sample: https://www.syncfusion.com/downloads/support/forum/169058/ze/Card-420973608

Please check the sample and let us know if you have any concerns.

Regards,

Gunasekar