Usuário com melhor resposta
Duvida centralizar spans numa view

Pergunta
-
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.
Respostas
-
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
- Editado Priscila Mayumi Sato segunda-feira, 26 de agosto de 2013 19:16
- Marcado como Resposta Fernando Fecher terça-feira, 27 de agosto de 2013 12:56
-
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
- Marcado como Resposta Fernando Fecher terça-feira, 27 de agosto de 2013 12:56
Todas as Respostas
-
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
-
-
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-->
-
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
- Editado Priscila Mayumi Sato segunda-feira, 26 de agosto de 2013 19:16
- Marcado como Resposta Fernando Fecher terça-feira, 27 de agosto de 2013 12:56
-
-
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
- Marcado como Resposta Fernando Fecher terça-feira, 27 de agosto de 2013 12:56
-
@{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-->
- Marcado como Resposta fernando silva 1Moderator segunda-feira, 26 de agosto de 2013 20:43
- Não Marcado como Resposta fernando silva 1Moderator segunda-feira, 26 de agosto de 2013 20:43