Duvida centralizar spans numa view

Question

Estou com a seguinte duvida:

@foreach (var item in Model )
{
<div class="span4">
.
.
.
</div><!--/span-->

}
a Cada 3 registros mostrados da maneira acima gostaria que fosse incluido uma
<div class="row-fluid">
para ficar sempre centralizado os 3 spans.

Answer 1

Boa Tarde

Eu faria assim

int countLines = 1;

@foreach (var item in Model )
{
<div class="span4">
.
.
.
</div><!--/span-->

@@if(countLines / 3 == 0 )

<div class="row-fluid">

countLines = countLines + 1;

}

Talvez pegar pelo index do item pode ser uma opção , dividindo por 3.

Que tipo de lista vc ta usando na Model???

[]s

Renato

Answer 2

Obrigado pela ajuda . E uma tabela de produtos  a numeracao pode estar furada. Nao conegui fazer sua dica pois ele reclama do fechamento da tag

Answer 3

Vou colocar o codigo exato assim fica mais facil para eu explicar o que preciso talvez haja outro jeito apenas eu nao conheco.

@{int contador = 0;}  <div class="row-fluid">   @foreach (var item in Model  )    {    @* eu preciso repetir o  <div class="row-fluid"> a cada 3 registros *@    <div class="span4">  <h4 class="text-left"> @Html.DisplayFor(modelItem => item.tpsistemas.dsTipoSistema) </h4>          <h6 class="text-left">@Html.DisplayFor(modelItem => item.dsResumido) </h6> <p class="text-left">@Html.DisplayFor(modelItem => item.cdSigla)</p> <h6 class="text-left"> AMBIENTE:@Html.DisplayFor(modelItem => item.dsAmbiente) </h6> <h3 class="text-left"> R$ @Html.DisplayFor(modelItem => item.vlProduto) </h3> @Html.ActionLink("Detalhes","Mostra", new { id=item.Id }, new { @class= "btn btn-danger"})  </div>  <!--/span--> } </div><!--/row-->

Answer 4

Seu código está um pouco errado... vc coloca a div com row-fluid fora do foreach, asism não tem como intercalar. A não ser que vc queira outras divs assim dentro da primeira.

Poderia ser assim:

@{int contador = 0;}
 <div class="row-fluid">
  @foreach (var item in Model  )
   {
   if(contador%3 ==0)
{
<div class="row-fluid">
}
   <div class="span4">
 <h4 class="text-left"> @Html.DisplayFor(modelItem => item.tpsistemas.dsTipoSistema) </h4>         
<h6 class="text-left">@Html.DisplayFor(modelItem => item.dsResumido) </h6>
<p class="text-left">@Html.DisplayFor(modelItem => item.cdSigla)</p>
<h6 class="text-left"> AMBIENTE:@Html.DisplayFor(modelItem => item.dsAmbiente) </h6>
<h3 class="text-left"> R$ @Html.DisplayFor(modelItem => item.vlProduto) </h3>
@Html.ActionLink("Detalhes","Mostra", new { id=item.Id }, new { @class= "btn btn-danger"})
 </div>
 <!--/span-->
if(contador%3 ==0)
{
</div class="row-fluid">
}
contador++;
}
</div><!--/row-->

Ainda não é elegante (dois ifs e tal) mas funciona

---

Priscila Mayumi Sato - MayogaX MayogaX Dev Blog


Co-lider do .Net Coders

Answer 5

nao sei porque mas basta eu incluir o if que comeca a dar erro de sintaxe em tudo dentro da view passa a dar erro ate no @foreach (var item in Model  )
   como se a chave do if estivesse faltando alguma coisa

Answer 6

Tenta fazer assim:

@{ foreach (....
{
//codigo
}
}

ou seja, deixar o bloco todo dentro de chaves precedidas de um arroba @

---

Priscila Mayumi Sato - MayogaX - MayogaX Dev Blog


Co-lider do .Net Coders

Answer 7

     @{int contador = 0;}


            <div class="row-fluid">
                @foreach (var item in Model  )
                {
                    if(contador%3 == 0)
                    {
                   
                             
                    }
      

                    <div class="span4">
                        <h4 class="text-left"> @Html.DisplayFor(modelItem => item.tpsistemas.dsTipoSistema)  </h4>         
                        <h6 class="text-left">@Html.DisplayFor(modelItem => item.dsResumido) </h6>
                        <p class="text-left">@Html.DisplayFor(modelItem => item.cdSigla)</p>
                        <h6 class="text-left"> AMBIENTE:@Html.DisplayFor(modelItem => item.dsAmbiente) </h6>
                        <h3 class="text-left"> R$ @Html.DisplayFor(modelItem => item.vlProduto) </h3>
                        @Html.ActionLink("Detalhes", "Mostra", new {id = item.Id}, new {@class = "btn btn-danger"}) 
                    </div>
                
                    if (contador % 3 == 0)
                    {


                
                    }
                    contador++;
         
                    }
                  
                    <!--/span-->