Clash Royale CLAN TAG#URR8PPP

ASP.NET MVC 5 webgrid

This is my View. It has a table and a webgrid.

@model IEnumerable<List.Models.cList>

@
ViewBag.Title = "List";
var grid = new WebGrid(source: Model, canPage: true, rowsPerPage: 20);
grid.Pager(WebGridPagerModes.All);

<h2>List</h2>


This is my table:

<table class="table">
<tr>
<th>
@Html.DisplayNameFor(model => model.ID)
</th>
<th>
@Html.DisplayNameFor(model => model.Name)
</th>
<th></th>
</tr>

@foreach (var item in Model)

<tr>
<td>
@Html.DisplayFor(modelItem => item.ID)
</td>
<td>
@Html.DisplayFor(modelItem => item.Name)
</td>
<td>
@Html.ActionLink("Podrobno", "Artikel_Podrobno", new parID = item.ID, parName = item.Name )
</td>
</tr>

</table>


This is my webgrid:

<style type="text/css">
.webgrid-table
font-family: Verdana;
font-size: 1em;
width: auto;
display: table;
border-collapse: separate;
border: solid 1px black;
background-color: white;


.webgrid-table td, th
border: solid 1px #98BF21;
padding: 3px 7px 2px;


.webgrid-header
background-color: azure;
color: aqua;
padding-bottom: 4px;
padding-top: 5px;
text-align: left;


.webgrid-footer


.webgrid-row-style
padding: 3px 7px 2px;


.webgrid-alternating-row
background-color: #EAF2D3;
padding: 3px 7px 2px;

</style>

<div id="content">
@grid.GetHtml(
tableStyle: "webgrid-table",
headerStyle: "webgrid-header",
footerStyle: "webgrid-footer",
alternatingRowStyle: "webgrid-alternating-row",
rowStyle: "webgrid-row-style",
columns: grid.Columns(
grid.Column(columnName: "ID", header: "ID", format:@<text>@Html.ActionLink("ID", "Analitics", new parID = item.ID, parName = item.Name )</text>),
grid.Column(columnName: "Name")
)
)
</div>


Now what I am trying to do is display the name of the column in webgrid like I did in my table (@Html.DisplayFor(modelItem => item.ID)). But because it requires a string I can't do this. So this (grid.Column(columnName: "ID", header: item.ID, ...) does not work.

Can anyone tell me how to do this?

1 Answer
1

Dynamic Header

columns: grid.Columns(
grid.Column("ID",null,format:@<text>@
string ID= item.ID;
@Html.DisplayFor(m => ID);
</text>),
grid.Column("Name",null,format:@<text>@
string Name= item.Name;
@Html.DisplayFor(m => Name);
</text>),
grid.Column(null,null,
format:@<text>
@
string userIdlink = item.ID;
@Html.ActionLink(userIdlink, "Analitics", new parID = item.ID, parName = item.Name );
</text>)
)


With Action Link

columns: grid.Columns(
grid.Column("ID","ID"),
grid.Column("Name","Name"),
grid.Column(null,null,
format:@<text>
@
string userIdlink = item.ID;
@Html.ActionLink(userIdlink, "Analitics", new parID = item.ID, parName = item.Name );
</text>)
)


You can do the following to get same UI style as that of above table.

columns: grid.Columns(
grid.Column("ID","ID"),
grid.Column("Name","Name"),
grid.Column("ID",null, format:@<a href="@Url.Action("Analitics","ControllerName",new parID = item.ID, parName = item.Name )">@item.ID</a>)
)


By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.