none
Duvida centralizar spans numa view RRS feed

  • 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.
    sábado, 24 de agosto de 2013 20:01

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


    segunda-feira, 26 de agosto de 2013 13:43
  • 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
    segunda-feira, 26 de agosto de 2013 19:17

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

    sábado, 24 de agosto de 2013 23:04
  • 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

    domingo, 25 de agosto de 2013 09:50
  • 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-->

    domingo, 25 de agosto de 2013 10:39
  • 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


    segunda-feira, 26 de agosto de 2013 13:43
  • 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
    segunda-feira, 26 de agosto de 2013 19:12
  • 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
    segunda-feira, 26 de agosto de 2013 19:17
  •      @{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-->
                     

    segunda-feira, 26 de agosto de 2013 20:02