Fazer um foreach dentro de uma cshtml(view) vindo de uma controller

15/09/2014

0

.NET

Fiz um código usando linq e jquery. Acontece que está me dando um problema que não consigo resolver, que é criar um treeview dinamicamente. Então tive outra idéia. Fazer o foreach direto na View(CSHTML). Aí vem a pergunta, como eu faço um foreach dentro da View e em cima de um resultado de uma linq que está em minha controller.

Controller:

[HttpPost]
        public JsonResult ArvoreAcao(string _uf)
        {
            RupturaEntities db = new RupturaEntities();

            var monta_arvore = (from rup in db.Ruptura
                                  from apr in db.Apresentacao.Where(apr => apr.Codigo_Apresentacao == rup.Codigo_Apresentacao)
                                  from pdv in db.PDV.Where(pdv => pdv.CodigoPDV == rup.CodigoPDV)
                                  from mot in db.Motivo.Where(mot => mot.IDMotivo == rup.IDMotivo)

                                  select new {
                                      rup.IDRuptura,
                                      rup.DataRuptura,
                                      rup.IDMotivo,
                                      mot.Motivo1,
                                      rup.IDOrigem,
                                      rup.CodigoPDV,
                                      pdv.UF,
                                      pdv.Cidade,
                                      loja = pdv.Cnpj + " - " + pdv.Descricao,
                                      rup.Codigo_Apresentacao,
                                      apr.Unidade_Negocio,
                                      apr.Franquia,
                                      apr.Familia,
                                      apr.Descricao}).ToList().Distinct().OrderBy(apr => apr.Descricao);

            return Json(new { monta_arvore }, JsonRequestBehavior.AllowGet);
        }


View.

@{
    ViewBag.Title = "Acao";
    Layout = "~/Views/Shared/_LayoutBase.cshtml";
}

<link href="~/Content/Jqwidgets/jqx.base.css" rel="stylesheet" type="text/css" />

<h2>Tomada de Ação</h2>

<div class="row">
    <div class="col-md-12">
        <div class="col-md-1">
            <label for="cbxCodTipo">UF:</label>
        </div>
        <div class="col-md-4">
            <select class="form-control col-md-6" name="cbxCodTipo" id="cbxCodTipo" onchange=" return MontaCidades();">
                <option value="00">Selecione um estado</option>
                <option value="AC">ACRE</option>
                <option value="AL">ALAGOAS</option>
                <option value="AP">AMAPÁ</option>
                <option value="AM">AMAZONAS</option>
                <option value="BA">BAHIA</option>
                <option value="CE">CEARÁ</option>
                <option value="DF">DISTRITO FEDERAL</option>
                <option value="ES">ESPÍRITO SANTO</option>
                <option value="GO">GOIÁS</option>
                <option value="MA">MARANHÃO</option>
                <option value="MT">MATO GROSSO</option>
                <option value="MS">MATO GROSSO DO SUL</option>
                <option value="MG">MINAS GERAIS</option>
                <option value="PA">PARÁ</option>
                <option value="PB">PARAÍBA</option>
                <option value="PR">PARANÁ</option>
                <option value="PE">PERNAMBUCO</option>
                <option value="PI">PIAUÍ</option>
                <option value="RJ">RIO DE JANEIRO</option>
                <option value="RN">RIO GRANDE DO NORTE</option>
                <option value="RS">RIO GRANDE DO SUL</option>
                <option value="RO">RONDÔNIA</option>
                <option value="RR">RORAIMA</option>
                <option value="SC">SANTA CATARINA</option>
                <option value="SP">SÃO PAULO</option>
                <option value="SE">SERGIPE</option>
                <option value="TO">TOCANTINS</option>
            </select>
        </div>
        <div class="col-md-6">
            <div class="col-md-2">
                <label for="cbxCidade">Cidade:</label>
            </div>
            <select class="form-control col-md-4" name="cbxCidade" id="cbxCidade"></select>
        </div>
    </div>

    <div class="col-md-12">
        <div class="col-md-1">
            <label for="cbxRede">Rede:</label>
        </div>
        <div class="col-md-4">
            <select class="form-control col-md-6" name="cbxRede" id="cbxRede"></select>
        </div>
        <div class="col-md-6">
            <div class="col-md-2">
                <label for="cbxRede">Descrição:</label>
            </div>
            <select class="form-control col-md-4" name="cbxDescricao" id="cbxDescricao"></select>
        </div>
    </div>

    <div class="col-md-12">
        <div class="col-md-1">
            <label for="cbxProduto">Produto:</label>
        </div>
        <div class="col-md-4">
            <select class="form-control col-md-6" name="cbxProduto" id="cbxProduto"></select>
        </div>
    </div>

    <div class="col-md-12">
        <div class="col-md-1">
            <label for="cbxUnNegocio">Unidade Negócio:</label>
        </div>
        <div class="col-md-4">
            <select class="form-control col-md-6" name="cbxUnNegocio" id="cbxUnNegocio"></select>
        </div>
    </div>
</div>

<br />

<div id="content">
    <div class="listTree"></div>
    <button class="btn btn-primary" onclick=" return MontaArvore();">Pesquisar</button>
</div>

<br>

<div id='jqxWidget'>
    <div style='float: left; width:auto;'>
        <div id='jqxTree' style=' float: left; margin-'>
            <ul>
                <li item-checked='false' item-expanded='false'>
                    Produto
                    <ul>
                            <li item-expanded='true'>
                                MIP
                                <ul>
                                    <li item-expanded='true'>
                                        Família: ACCUVIT
                                        <ul>
                                            <li>ACCUVIT COMREV FRX30</li>
                                        </ul>
                                    </li>
                                    <li item-expanded='true'>
                                        Família: FLOGORAL
                                        <ul>
                                            <li>FLOGORAL SPRAY CEREJA CTX30ML</li>
                                            <li>FLOGORAL SPRAY MENTA CTX30ML</li>
                                            <li>FLOGORAL CREM DENTAL CTX70G</li>
                                        </ul>
                                    </li>
                                </ul>
                            </li>
                        </ul>
                </li>
            </ul>

        </div>

        <div style='margin- float: left;'>
            <div style='margin-'>
                <input id='jqxCheckBox' type="hidden">
            </div>
        </div>

    </div>
</div>@*Fim da div jqxWidget *@

    <div class="row">
        <div class="col-md-12">
            <div class="col-md-2">
                <label for="txtObs">Observação:</label>
            </div>
            <div class="col-md-12">
                <textarea id="txtObs" style="width: 450px;"></textarea>
            </div>
        </div>
    </div>

    <br />

    <div id="content">
        <div class="listTree"></div>
        <button class="btn btn-success" ">Gravar</button>
        @Html.ActionLink("Voltar", "Index", "Home", new { }, new { @class = "btn btn-danger" })
    </div>

    @*<script class="cssdeck" src="//cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>*@
    <script class="cssdeck" src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.3.1/js/bootstrap.min.js"></script>

    <script src="~/Scripts/Acao/Acao.js"></script>
    <script src="~/Scripts/Jqwidgets/jqxcore.js"></script>
    <script src="~/Scripts/Jqwidgets/jqxbuttons.js"></script>
    <script src="~/Scripts/Jqwidgets/jqxscrollbar.js"></script>
    <script src="~/Scripts/Jqwidgets/jqxpanel.js"></script>
    <script src="~/Scripts/Jqwidgets/jqxtree.js"></script>
    <script src="~/Scripts/Jqwidgets/jqxcheckbox.js"></script>

Importante: A controller se Chama AcaoController. O .edmx está dentro de Model(Folder) e uso Entity.
Pjava

Pjava

Responder

Post mais votado

16/09/2014

O foreach deve ficar dentro do UL,não fora. Da forma como está, você está criando várias listas com um item cada, quando na verdade você deseja criar uma só lista com vários itens.

Joel Rodrigues

Joel Rodrigues
Responder
Gostei + 1

Mais Posts

15/09/2014

Joel Rodrigues

Exemplo:
@foreach(var item in Model)
{
   <p>@item.Propriedade</p>
}


Esse exemplo geraria vários parágrafos com a Propriedade do objeto modelo, um para cada item na lista, considerando que o Model é uma lista de objetos de um determinado tipo.

Um exemplo simples disso pode ser visto se você adicionar uma View com o template List e definir uma classe como modelo. Automaticamente o VS criará uma tabela que usa um foreach para adicionar as linhas de acordo com a lista recebida como modelo.
Responder
Gostei + 0

15/09/2014

Pjava

Fui fazer conforme o Joel postou e me dá o erro que não é possível fazer o foreach, porque a minha classe não tem uma propriedade pública GetEnumerator. Como eu faço?
Responder
Gostei + 0

16/09/2014

Pjava

Fiz e agora funciona em partes. O erro era que a forma como eu trazia a model estava errado. Criei uma model e retornei ela para o html e agora sim, funciona. Só não entendo uma coisa. Eu tenho 11 mil registros e na hora de montar o html pelo foreach, ela vai trazendo e apenas o último registro fica na página. Deveria ir montando um a um e o resultado final, seria uma lista imensa. Veja o código, apenas do foreach.
<div id='jqxWidget'>
    <div style='float: left; width:auto;'>
        <div id='jqxTree' style='visibility: hidden; float: left; margin-left: 20px;'>

            @foreach (var item in Model)
            {
                    <ul>
                        <li item-checked='false' item-expanded='false'>
                            @item.Motivo
                        </li>
                    </ul>
            }
</div>

        <div style='margin-left: 60px; float: left;'>
            <div style='margin-top: 10px;'>
                <input id='jqxCheckBox' type="hidden">
            </div>
        </div>

    </div>
</div>
Responder
Gostei + 0

16/09/2014

Pjava

Assim funcionou:
<ul>
@foreach (var item in Model)
            {
                   
                        <li item-checked='false' item-expanded='false'>
                            @item.Motivo
                        </li>
                    
            }
</ul>
Responder
Gostei + 0

Assista grátis a nossa aula inaugural

Assitir aula

Saiba por que programar é uma questão de
sobrevivência e como aprender sem riscos

Assistir agora

Utilizamos cookies para fornecer uma melhor experiência para nossos usuários, consulte nossa política de privacidade.

Aceitar