Recording to multiple tables in asp.net core mvc application

Question

I am developing application in MVC. I have four classes corresponding to four tables in a database (tasks, details, notes, logs).

I want to save, edit and delete data in these three tables from a single webpage. I couldn't find any examples of this. Often there were instances of data entry and editing in a single table, and that wasn't enough.

public class Tasks {
    [Column("id")]
    [Display(Name = "Talep No")]
    [Key]
    public int Id { get; set; }

    [Display(Name = "Talep Yapılacak Birim")]
    [Column("type_id")]     
    public int TypeId { get; set; }

    [Display(Name = "Talep Tipi")]
    [Column("subtype_id")]
    public int SubTypeId { get; set; }

    [Display(Name = "İstek Tarihi")]
    [Column("start_date")]
    public DateTime StartDate { get; set; }

    [Display(Name = "İstek Yapan Birim")]
    [Column("operator_foundationunit_id")]
    public Nullable<int> OperatorFoundationUnitId { get; set; }

    [Column("adres")]
    [Display(Name = "Adres")]
    public string Adres { get; set; }

    [Column("ilgili_kisi")]
    [Display(Name = "İlgili Kişi")]        
    public string IlgiliKisi { get; set; }

    [Column("telefon_no")]
    [Display(Name = "Telefon")]        
    public string TelefonNo { get; set; }

    //[Display(Name = "Email")]
    //[Column("email")]
    //public string Email { get; set; }

    [Display(Name = "Mesaj")]
    [Column("message")]
    public string Message { get; set; }
}

Zhi Lv · Accepted Answer · 2021-07-08 06:45:27Z

You could create a ViewModel which contains the four tables' entity reference. For example:

//EF Core entities:map the database tasks,details,notes,logs table.
public class Task
{
    [Key]
    public int TaskId { get; set; }
    public string TaskName { get; set; }
}
public class Detail
{
    [Key]
    public int DetailId { get; set; }
    public string DetainInformation { get; set; }
}
public class Note
{
    [Key]
    public int NoteId { get; set; }
    public string NoteMessage { get; set; }
}
public class Log
{
    [Key]
    public int LogId { get; set; }
    public string LogContent { get; set; }
}

//the view Model
public class TaskViewModel
{
    public List<Task> Tasks { get; set; }
    public List<Detail> Details { get; set; }
    public List<Note> Notes { get; set; }
    public List<Log> Logs { get; set; }
}

Then, in the controller:

    public IActionResult TaskIndex()
    {
        //create a ViewModel.
        //query database and get the related data.
        var taskvm = new TaskViewModel()
        {
            Tasks = new List<Models.Task>() { new Models.Task() { TaskId = 1, TaskName = "AA" }, new Models.Task() { TaskId = 2, TaskName = "BB" } },
            Details = new List<Detail>() { new Detail() { DetailId = 101, DetainInformation = "D1" }, new Detail() { DetailId = 102, DetainInformation = "D2" } },
            Notes = new List<Note>() { new Note() { NoteId = 1001, NoteMessage = "Hello" }, new Note() { NoteId = 1002, NoteMessage = "Hi" } },
            Logs = new List<Log>() { new Log() { LogId = 1, LogContent = "application start" }, new Log() { LogId = 2, LogContent = "Application end" } }
        };

       return View(taskvm);
    }

Code in the Index Page: Use Partial View to display each table.

@model MVCWebApplication.Models.TaskViewModel

@{
    ViewData["Title"] = "TaskIndex";
    Layout = "~/Views/Shared/_Layout.cshtml";
}
 
<div class="container">
    <div class="row">
        <div class="col-6">
            <div class="form-group">
                <partial name="_pvTask" model="Model.Tasks" />
            </div>
        </div>
        <div class="col-6">
            <div class="form-group">
                <partial name="_pvDetail" model="Model.Details" />
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-6">
            <div class="form-group">
                <partial name="_pvNote" model="Model.Notes" />
            </div>
        </div>
        <div class="col-6">
            <div class="form-group">
                <partial name="_pvLog" model="Model.Logs" />
            </div>
        </div>
    </div>
</div>

The _pvTask partial view as below:

@model IEnumerable<MVCWebApplication.Models.Task>
 
<table class="table">
    <thead>
        <tr>
            <th>
                @Html.DisplayNameFor(model => model.TaskId)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.TaskName)
            </th>
            <th></th>
        </tr>
    </thead>
    <tbody>
@foreach (var item in Model) {
        <tr>
            <td>
                @Html.DisplayFor(modelItem => item.TaskId)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.TaskName)
            </td>
            <td>
                @Html.ActionLink("Edit", "Edit", new { /* id=item.PrimaryKey */ }) |
                @Html.ActionLink("Details", "Details", new { /* id=item.PrimaryKey */ }) |
                @Html.ActionLink("Delete", "Delete", new { /* id=item.PrimaryKey */ })
            </td>
        </tr>
}
    </tbody>
</table>

To insert or edit special item, you could use the Bootstrap Modal to show a popup modal (with partial view), then, use JQuery Ajax to insert or update the entity value.

To delete special item, you could use JQuery Ajax to call the delete action method and transfer the primary key as parameter. Then, refresh the partial view to display the latest data.

Here are some relate resource about use JQuery Ajax to load partial view, you could refer them:

how to load partial view in ajax in asp.net core

Bootstrap Modal showing with blank edit data

Thank you for your reply. I am sorry for the late reply. Because I was doing research on the project. And I was trying to find the right method. I will share the latest version of the changes I made here. I would be glad if you give your opinion. I used a structure similar to the class structure you suggested. There are some differences of course :) Stay healthy
Never mind and glad it helps you solve the problem. Since this post has been created for a long time, if you still have any questions or any update, I suggest you can create a new post so that more community members will see it and help you solve the problem. Have a nice day!

Collectives™ on Stack Overflow

Recording to multiple tables in asp.net core mvc application

1 Answer 1

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related