CODEWITHSUNDEEP
c#asp.net-coreasp.net-core-mvcrazor-pages
Ramesh
Ramesh

Reputation: 1145

Add one more property to default Index.cshtml RazorPages ASP.NET Core 2.1.0

I am using ASP.NET Core 2.1.0 in a project where I want to add one extra property to default scaffolding Index.cshtml page.

Here is my entities - please suggest:

public class Role
{
    public int RoleId { get; set; }
    public string RoleName { get; set; }

    public ICollection<UserRole> UserRole { get; set; }
}

public class User
{
    [DatabaseGenerated(DatabaseGeneratedOption.None)]
    public string UserName { get; set; }
    public string Password { get; set; }
    public string MobileNumber { get; set; }
    public string Email { get; set; }

    public ICollection<UserRole> UserRole { get; set; }
}

public class UserRole
{    
    public int Id { get; set; }
    public string UserName { get; set; }
    public int RoleId { get; set; }

    [ForeignKey("RoleId")]
    public Role Role { get; set; }
    [ForeignKey("UserName")]
    public User User { get; set; }
}

Now, the default scaffolding Index.cshtml displays RoleID and UserNamewhere as I want to add one more column i.e RoleName which is available at Role entity.

List should be RoleID, RoleName, UserName

Here is my scaffolding page model.

public class IndexModel : PageModel
{
    private readonly Test.Models.TestContext _context;

    public IndexModel(Test.Models.TestContext context)
    {
        _context = context;
    }

    public IList<UserRole> UserRole { get;set; }

    public async Task OnGetAsync()
    {
        UserRole = await _context.UserRole
            .Include(u => u.Role)
            .Include(u => u.User).ToListAsync();
    }
}

Please help me out without disturbing any other pages such as Edit, Detail, Delete.

Update: markup in Index.cshtml:

@page
@model Test.Pages.UserRoles.IndexModel

@{
    ViewData["Title"] = "Index";
}

<h2>Index</h2>

<p>
    <a asp-page="Create">Create New</a>
</p>
<table class="table">
    <thead>
        <tr>
            <th>
                @Html.DisplayNameFor(model => model.UserRole[0].Role)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.UserRole[0].User)
            </th>
            <th></th>
        </tr>
    </thead>
    <tbody>
        @foreach (var item in Model.UserRole)
        {
            <tr>
                <td>
                    @Html.DisplayFor(modelItem => item.Role.RoleId)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.User.UserName)
                </td>
                <td>
                    <a asp-page="./Edit" asp-route-id="@item.Id">Edit</a> |
                    <a asp-page="./Details" asp-route-id="@item.Id">Details</a> |
                    <a asp-page="./Delete" asp-route-id="@item.Id">Delete</a>
                </td>
            </tr>
        }
    </tbody>
</table>

Upvotes: 1

Views: 301

Answers (1)

D-Shih
D-Shih

Reputation: 46229

You can try to use @item.Role.RoleName in your index.chtml

Note

I will suggest you use different ViewModel class to carry data for each view instead of ModelContext because of ModelContext responsible for getting DB data properties to mapper Db tables schema.

ViewModel responsible for carrying show data.

Here is a link wish can help you

Upvotes: 1

Related Questions