Home > Software design >  How to make a counter in a table in asp.net mvc
How to make a counter in a table in asp.net mvc

Time:09-28

Hello, good afternoon. I am making a view in Razor ASP.NET 6. I find myself making a table and what I want to do is in the column N° add a counter, that for each row it creates, I add 1,2,3,4,5, etc. Try to do it with a for, foreach, but it is returning something that does not interest me, or it returns the total value of the rows. And what I need is to add 1. I'm going to leave an example image. I would be very grateful if someone can help me. Thanks. enter image description here

@model Taller.Model.Entities.Remito
@{
var counter = @Model.RemitoDetalle.Count();
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>

  </head>
 <body
style="height: 297mm; width: 210mm; margin-left: auto; margin-right: auto"
 >

  <!-- Tabla -->
  <div >
    <table style="width: 100%">
      <tr>
        <th style="text-align: left">N°</th>
        <th>Detalle</th>
        <th style="text-align: left">Cantidad</th>
        <th style="text-align: left">Alto</th>
        <th style="text-align: left">Ancho</th>
      </tr>
      <tbody>
           @foreach (var item in Model.RemitoDetalle)
            {
        <tr>
            @for (var i = 1; i < counter; i  )
           {
               <td>@i</td>
           }
          <td>@Html.DisplayFor(modelItem => item.PresupuestoDetalle.Descripcion) 
          </td>
          <td>@Html.DisplayFor(modelItem => item.PresupuestoDetalle.Cantidad)</td>
          <td>@Html.DisplayFor(modelItem => item.PresupuestoDetalle.Alto)</td>
          <td>@Html.DisplayFor(modelItem => item.PresupuestoDetalle.Ancho)</td>
        </tr>
            }
      </tbody>
    </table>
  </div>

CodePudding user response:

You're going over all possible values of the counter for every row. You should only increment it once per row, like this:

<tbody>
   @int i = 0;
   @foreach (var item in Model.RemitoDetalle)
    {
        i  ;
        <tr>
          <td>@i</td>
          <td>@Html.DisplayFor(modelItem => item.PresupuestoDetalle.Descripcion) 
          </td>
          <td>@Html.DisplayFor(modelItem => item.PresupuestoDetalle.Cantidad)</td>
          <td>@Html.DisplayFor(modelItem => item.PresupuestoDetalle.Alto)</td>
          <td>@Html.DisplayFor(modelItem => item.PresupuestoDetalle.Ancho)</td>
        </tr>
    }
</tbody>

CodePudding user response:

Try this:

<tbody>
    @for (var i = 0; i < Model.RemitoDetalle.Count(); i  )
    {
        <tr>
            <td>@i</td>
            <td>
                @Html.DisplayFor(model => model.RemitoDetalle[i].PresupuestoDetalle.Descripcion)
            </td>
            <td>@Html.DisplayFor(model => model.RemitoDetalle[i].PresupuestoDetalle.Cantidad)</td>
            <td>@Html.DisplayFor(model => model.RemitoDetalle[i].PresupuestoDetalle.Alto)</td>
            <td>@Html.DisplayFor(model => model.RemitoDetalle[i].PresupuestoDetalle.Ancho)</td>
        </tr>
    }
</tbody>

CodePudding user response:

Replace

@for (var i = 1; i < counter; i  )
{
    <td>@i</td>
}    

by

<td>@(  counter)</td>

And on begin of the view or another code line before using it:

@{
    var counter = 0;
}
  • Related