none
Retornando lista com MVC 3 e Json RRS feed

  • Pergunta

  • Boa noite!

    Estou tentando retornar uma lista usando json, mas o retorno que recebo quando pesquiso, é o seguinte:

    [{"nome":"Ice","idade":89},{"nome":"Ice","idade":78},{"nome":"Ice","idade":23},{"nome":"Ice","idade":12}]

    O que estou fazendo de errado?

    Segue meu codigo:

    Controller:

    public class AutoController : Controller
        {
            private BancoEntities db = new BancoEntities();
            //
            // GET: /Auto/
    
            public ActionResult Index()
            {
                return View();
            }
    
            public JsonResult Teste(string pessoa)
            {
                var result = from c in db.Pessoa
                            where
                                c.nome == pessoa
                            select new { c.nome, c.idade };
    
                return Json(result, JsonRequestBehavior.AllowGet);
            }
    
        }

    View:

    @{
        ViewBag.Title = "Index";
    }
    
    <script src="../../Scripts/jquery-1.7.1.js"></script>
    <script src="../../Scripts/jquery-1.7.1.min.js"></script>
    
    <h2>Index</h2>
    
     @using(Html.BeginForm("Teste","Auto",FormMethod.Get)) {
         
    <div id="resultado">
    </div>
        
        <p>
            <label>Nome</label>
            @Html.TextBox("pessoa")
            <input type="submit" value="Pesquisar" id="getPessoa" />
        </p>
     }
    
    <script type="text/javascript">
    
        $(doument).ready(function () {
            $("#getPessoa").click(btnGetJson_click);
    
        });
    
        function btnGetJson_click() {
            $.getJSON("/Auto/Teste/", { pessoa: $("#pessoa").val() }, function (data) {
                $("#resultado").empty();
                $("#resultado").append("<table><thead><tr><th>Nome</th><th>Idade</th></tr></thead><tbody id='bodyTable'>");
    
                $(data).each(function () {
                    $("#bodyTable").append("<tr><td>" + this.nome + "</td><td>" + this.idade + "</td></tr>");
                });
    
                $("#resultado").append("</tbody></table>");
            });
        }
    
    </script>
    

    Grato.

    sábado, 8 de março de 2014 02:35

Respostas

  • Opa... Blz. Uallace !

    Da forma que vc faz está correto, mas vc só está chamando o objeto json que está vindo da sua action, vc precisa passar como para parâmetro na função de seu each, os valores key e val, leia a documentação do jQuery sobre o function do each.

    Exemplo:

    function btnGetJson_click() { $.getJSON("/Auto/Teste/", { pessoa: $("#pessoa").val() }, function (data) { $("#resultado").empty(); $("#resultado").append("<table><thead><tr><th>Nome</th><th>Idade</th></tr></thead><tbody id='bodyTable'>");

    //Use o key e val

    //Agora se não quiser desta forma, use o JSON.stringify(data), assim seu objeto json é convertido para string... $(data).each(function (key, val) { $("#bodyTable").append("<tr><td>" + Jsval.nome + "</td><td>" + val.idade + "</td></tr>"); }); $("#resultado").append("</tbody></table>"); }); }

                

    Veja o exemplo de código dos proprios criadores do ASP.NET MVC o ASP.NET Team da Microsoft.

    http://code.msdn.microsoft.com/how-to-construct-complex-333db061

    Abraços... Qualquer coisa tamo ai, espero ter ajudado !!!

    Anderson Anzileiro.




    • Sugerido como Resposta Anderson Anzileiro domingo, 9 de março de 2014 15:35
    • Marcado como Resposta Uallace terça-feira, 18 de março de 2014 02:14
    • Editado Anderson Anzileiro quinta-feira, 2 de outubro de 2014 14:30
    domingo, 9 de março de 2014 15:34
  • Blz Uallace, Então cara. Você não pode fazer um BeginForm submetendo para 2 actions, assim não funciona mesmo.

    O verbo POST - serve para postar algo, enviar, delegar, chutar...

    O verbo GET - serve para obter algo, possuir, chamar, invocar...

    Análise seu código: @using (Html.BeginForm("Index", "Auto", FormMethod.Post, new {@action = "/Auto/Teste/"}))

    Olhou, tipo vc tem como parâmetro no helper BeginForm action: Index na controller : Auto, depois define o que será submetido atraves do verbo POST, logo em seguida você da um new e define novamente uma rota para outra action, que por acaso devolve um json result atraves do verbo GET, tipo não vai funcionar mesmo, retire esse cara : @action = "/Auto/Teste/", ou escolha qual vc irá usar !

    Blz. Brow, qualquer coisa tamo ai no forum... Abraços !!!

    Anderson Anzileiro.





    • Sugerido como Resposta Anderson Anzileiro quinta-feira, 13 de março de 2014 16:34
    • Marcado como Resposta Uallace terça-feira, 18 de março de 2014 02:13
    • Editado Anderson Anzileiro quinta-feira, 2 de outubro de 2014 14:31
    quinta-feira, 13 de março de 2014 16:33

Todas as Respostas

  • Nesse link eu tenho um exemplo de WebApi.!

    http://code.msdn.microsoft.com/Utilizando-Web-Api-CVbNet-f99332e3

    A rotina minha de carregamento da lista que vem é assim:

    function ListarPessoa() {         
    	$.getJSON("/api/pessoas", function (data) { 
    		$("#ulLista").empty(); 
    		var li = ""; 
    		$.each(data, function(key, value){ 
    			li = li + "<li>" 
    			li = li + "<input type=\"text\" name=\"Nome" + value.Id + "\" id=\"Nome" + value.Id + "\" value=\"" + value.Nome + "\" />"; 
    			li = li + "<button onclick=\"EditarPessoa('" + value.Id + "')\">Editar</button>"; 
    			li = li + "<button onclick=\"DeletarPessoa('" + value.Id + "')\">Excluir</button>"; 
    			li = li + "</li>";                
    		});                              
    		$("#ulLista").html(li);             
    	}); 
    }
    O Meu each é um pouco diferente do seu ... dá uma olhada e tente adaptar!!!


    Fulvio Cezar Canducci Dias


    sábado, 8 de março de 2014 14:47
  • Opa... Blz. Uallace !

    Da forma que vc faz está correto, mas vc só está chamando o objeto json que está vindo da sua action, vc precisa passar como para parâmetro na função de seu each, os valores key e val, leia a documentação do jQuery sobre o function do each.

    Exemplo:

    function btnGetJson_click() { $.getJSON("/Auto/Teste/", { pessoa: $("#pessoa").val() }, function (data) { $("#resultado").empty(); $("#resultado").append("<table><thead><tr><th>Nome</th><th>Idade</th></tr></thead><tbody id='bodyTable'>");

    //Use o key e val

    //Agora se não quiser desta forma, use o JSON.stringify(data), assim seu objeto json é convertido para string... $(data).each(function (key, val) { $("#bodyTable").append("<tr><td>" + Jsval.nome + "</td><td>" + val.idade + "</td></tr>"); }); $("#resultado").append("</tbody></table>"); }); }

                

    Veja o exemplo de código dos proprios criadores do ASP.NET MVC o ASP.NET Team da Microsoft.

    http://code.msdn.microsoft.com/how-to-construct-complex-333db061

    Abraços... Qualquer coisa tamo ai, espero ter ajudado !!!

    Anderson Anzileiro.




    • Sugerido como Resposta Anderson Anzileiro domingo, 9 de março de 2014 15:35
    • Marcado como Resposta Uallace terça-feira, 18 de março de 2014 02:14
    • Editado Anderson Anzileiro quinta-feira, 2 de outubro de 2014 14:30
    domingo, 9 de março de 2014 15:34
  • E ai Anderson beleza?

    Sua dica me ajudou bastante, coloquei os parametros da função jquery, e agora funciona!

    Mas eu também tirei a referencia do form que esta abaixo:

     @using (Html.BeginForm("Index", "Auto", FormMethod.Post, new {@action = "/Auto/Teste/"}))

    Essa referencia retornava o objeto json apenas para a action.Tentei colocar essa referencia, porque 

    eu faço o post na action Index e o get na action Teste.

    Mas não consegui carregar a lista com essa referencia, alguma dica de como proceder com essa referencia do form?

    Grato.

    quarta-feira, 12 de março de 2014 03:04
  • Blz Uallace, Então cara. Você não pode fazer um BeginForm submetendo para 2 actions, assim não funciona mesmo.

    O verbo POST - serve para postar algo, enviar, delegar, chutar...

    O verbo GET - serve para obter algo, possuir, chamar, invocar...

    Análise seu código: @using (Html.BeginForm("Index", "Auto", FormMethod.Post, new {@action = "/Auto/Teste/"}))

    Olhou, tipo vc tem como parâmetro no helper BeginForm action: Index na controller : Auto, depois define o que será submetido atraves do verbo POST, logo em seguida você da um new e define novamente uma rota para outra action, que por acaso devolve um json result atraves do verbo GET, tipo não vai funcionar mesmo, retire esse cara : @action = "/Auto/Teste/", ou escolha qual vc irá usar !

    Blz. Brow, qualquer coisa tamo ai no forum... Abraços !!!

    Anderson Anzileiro.





    • Sugerido como Resposta Anderson Anzileiro quinta-feira, 13 de março de 2014 16:34
    • Marcado como Resposta Uallace terça-feira, 18 de março de 2014 02:13
    • Editado Anderson Anzileiro quinta-feira, 2 de outubro de 2014 14:31
    quinta-feira, 13 de março de 2014 16:33
  • Valeu pela dica abraço!
    terça-feira, 18 de março de 2014 02:13