1

Eu estou tentando montar uma tabela fazendo uma requisição ao servidor e popula-la com o retorno.

O retorno do servidor esta correto, mas quando entra na function(data), percebi que ele carrega toda a minha pagina html, já tentei jogar o ajax direto no $(document).ready, e depois usar a forma que esta em abaixo, usando o load, porem, nenhum dos dois estão funcionando.

$("#table_horde").Load(
     $.ajax({
         type: "POST",
         url: "/Horde/List/",
         success: function (data) {

             var cols = "";

             for (var i = 0; i < data.length; i++) {
                 cols += "<tr>";
                 cols += "<td>" + data[i].NomeHorda + "</td>";
                 cols += "<td>" + data[i].Limit + "</td>";
                 cols += "<td><a href='#' onclick='atualizar'(" + data[i].IdHorde + ")' data-target='#janelaHordaCadastro' data-toggle='modal'>Atualizar</a></td>";
                 cols += "<td><a href='#' onclick='excluir'(" + data[i].IdHorde + ")'>Excluir</a></td>";
                 cols += "</td>";
             }

             $("#table_horde tbody").empty();
             $("#table_horde tbody").append(cols);
             $("#qtdRegistro").html(data.length);
         },
         error: function (ex) {
             alert("Erro: " + ex.status);
         }
     })
);

Meu Controller está da seguinte forma:

public ActionResult List() { 
    return View("List", ListinerHorde()); 
} 

private List<HordeList> ListinerHorde() {
  var list = new List<HordeList>();
  HordeRepository hr = new HordeRepository(); 

  foreach (var h in hr.FindAll()) {
   var model = new HordeList(); 
   model.NameHorde = h.NameHorde; 
   model.Limit = h.Limit; 
   list.Add(model); 
  } 

  return list; 
} 

Veja abaixo a imagem do retorno:

inserir a descrição da imagem aqui

11
  • Como está o retorno do seu controller?
    – Randrade
    Commented 3/05/2017 às 16:06
  • 3
    Note que nesta linha cols += "</td>"; você está fechando o elemento td, quando deveria ser um tr
    – Randrade
    Commented 3/05/2017 às 16:07
  • É verdade @Randrade, não havia reparado... Corrigi, mas o erro continua. a controller esta´retornando a lista de registro do banco corretamente
    – Mfilho_19
    Commented 3/05/2017 às 16:22
  • Poste um exemplo, se possível. No console (F12) aparece algum erro?
    – Randrade
    Commented 3/05/2017 às 16:23
  • Eu chamo esse metodo na controller e no console não aparece erro nenhum, pelo contrario... me da status 200. Mas acho que meu problema é aqui "function (data)", ta carregando toda a minha DOM nessa função Não to conseguindo postar o codigo, é muito grande @Randrade
    – Mfilho_19
    Commented 3/05/2017 às 16:30

1 Resposta 1

2

Em seu Controller você está retornando uma View, mas em seu Ajax você está esperando uma lista.

Uma solução seria somente retornar a lista para a View, com isso, crie uma Action para retornar o JSON. Neste caso eu chamei de ListaJson() apenas para você entender melhor, mas pode colocar o nome que desejar.

public ActionResult ListaJson() { 
     var lista = ListinerHorde();
     return Json(lista , JsonRequestBehavior.AllowGet);
} 

Feito isso, apenas altera a URL do seu Ajax, desta forma:

 url: "/Horde/ListaJson/",

Agora, caso queira retornar a View, você não precisa montar a tabela no front-end, e sim adicionar o HTML retornado, um exemplo seria isso:

$.ajax({
     type: "POST",
     url: "/Horde/List/",
     success: function (data) {
        //Coloque aqui o local onde a View deverá ocupar
        $("#table_horde").html(data);
     },
     error: function (ex) {
         alert("Erro: " + ex.status);
     }
});

Apenas lembre de alterar o $("#table_horde").html(data); para o local onde a View deverá ocupar.

11
  • 1
    Sim, porque você está retornando uma página inteira. A View que está o código Ajax é a mesma que a que você está chamando (Horde/List)?
    – Randrade
    Commented 3/05/2017 às 17:02
  • 1
    Então, você não conseguirá o que deseja na mesma forma. Crie uma nova Action retornando o Json, da forma da minha resposta e altere a url do seu Ajax. Fazendo isso, deve funcionar normalmente
    – Randrade
    Commented 3/05/2017 às 17:05
  • 1
    Ele vai inserir normalmente. O que é necessário ver é como você está trabalhando com eventos dinâmicos. Mas teste e me fale o resultado
    – Randrade
    Commented 3/05/2017 às 17:12
  • 1
    @Mfilho_19 Poste como está a sua View na pergunta
    – Randrade
    Commented 3/05/2017 às 17:29
  • 1
    @Mfilho_19 Esqueci deste detalhe, sorry.
    – Randrade
    Commented 3/05/2017 às 17:56

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .