How to render database row as html header in mvc 4? - asp.net-mvc

Question

I am doing web application where i have one table. i am making row data as html table header based on id.
This is what i tried. This is controller code.
public ActionResult Index()
{
var table = new List<test> {
new test { Label = "DocumentNumber", Value = "12345678", Emp_id = 1, Name = "First" },
new test { Label = "ExpiryDate", Value = "1/1/2015", Emp_id = 1, Name = "First" },
new test { Label = "DocumentNumber", Value = "123", Emp_id = 2, Name = "Second" },
new test { Label = "ExpiryDate", Value = "1/1/20244", Emp_id = 2, Name = "Second" }
};
var items = table.Where(x => x.Emp_id == 1 || x.Emp_id == 2).ToList();
var headers = items.Select(x => x.Label).Distinct().ToList();
var employers = items.Select(x => x.Emp_id).Distinct().ToList();
if(employers.Count > 1)
headers.Insert(0, "Name");
var data = new List<List<string>>();
data.Add(headers);
foreach (var emp in employers)
{
var row = new List<string>();
foreach (var header in headers)
{
if (header != "Name")
{
var cell = items.Where(x => x.Label == header && x.Emp_id == emp).FirstOrDefault();
row.Add(cell == null ? "" : cell.Value);
}
else
row.Add(items.Where(x => x.Emp_id == emp).First().Name);
}
data.Add(row);
}
return View(data);
}
This is view code
#model List<List<string>>
<table>
<thead>
<tr>
#foreach (var header in Model.First())
{
<th>#header</th>
}
</tr>
</thead>
<tbody>
#foreach (var row in Model.Skip(1))
{
<tr>
#foreach (var cell in row)
{
<td>#cell</td>
}
</tr>
}
</tbody>
</table>
Now i am able to render as below.
Name DocumentNumber ExpiryDate
First 12345678 1/1/2015
Second 123 1/1/20244
But i want header to be appeared for each row of data. For example if i add one more header Issueddate for Emp_id 2(i hardcoded at the begining) the output should look like below.
Name DocumentNumber ExpiryDate
First 12345678 1/1/2015
Name DocumentNumber ExpiryDate Issueddate
Second 123 1/1/20244 1/1/2015
So in the above code where i should make changes to appear headers for each row of data? Hope you clearly understood the scenario. Thanks in advance. i tried as you said but header appends to each row of data as below.
Name DocumentNumber ExpiryDate Issueddate
First 12345678 1/1/2015
Name DocumentNumber ExpiryDate Issueddate
Second 123 1/1/20244 1/1/2015
now issued date should come for only emp_id with 2? Hope you understood.
This is my code.
var table = new List<test> {
new test { Label = "DocumentNumber", Value = "12345678", Emp_id = 1, Name = "First" },
new test { Label = "ExpiryDate", Value = "1/1/2015", Emp_id = 1, Name = "First" },
new test { Label = "DocumentNumber", Value = "123", Emp_id = 2, Name = "Second" },
new test { Label = "ExpiryDate", Value = "1/1/20244", Emp_id = 2, Name = "Second" },
new test { Label = "Issuedon", Value = "1/1/20244", Emp_id = 2, Name = "Second" }
With respect to above data i want output like this below.
Name DocumentNumber ExpiryDate
First 12345678 1/1/2015
Name DocumentNumber ExpiryDate Issueddon
Second 123 1/1/20244 1/1/20244

Answer 1

Move the first loop to inside the second loop
<table>
<tbody>
<tr>
#for (int i = 1; i < Model.Count; i++)
{
foreach (var header in Model.First())
{
if (header == "Issuedon")
{
if (!string.IsNullOrEmpty(Model[i][3])) //assuming issue date will be at 3rd index , thoug this approch is not good as OP send model as List of string not model which is a ideal option
{
<th>#header
</th>
}
else
{
continue;
}
}
else
{
<th>#header
</th>
}
}
<tr>
#foreach (var cell in Model[i])
{
<td>#cell
</td>
}
</tr>
}
</tr>
</tbody>
SIDE NOTE : assuming issue date will be at 3rd index , though this approach is not good But there is no other option as OP send model as List of string not model which should be an ideal option