Load table via AJAX

Question

Load table via AJAX

Navigation

#1 by (1 votes)

1

I'm trying to load data from a table, via ajax, like this:

function buscaFornecedores(id) {
    var url = "/Produto/BuscaFornecedor";
    $.ajax({
        url: url,
        type: 'GET',
        data: { id: id},
        success: function (data) {
            $("#tabelaf").html(data);
        }
    });
}

And here's how it's in the controller:

  [HttpGet]
    public ActionResult BuscaFornecedor(int id)
    {
        var fornecedor_produto = db.ProdutosFornecedores.Where(p => p.ProdutoID == id).ToList();

        return Json(new { Resultado = fornecedor_produto });
    }

But it appears blank, what's missing in the code?

Edit: The console log looks like this:

Thisisthecodeforthetable:

<tableclass="table table-responsive table-hover" id="tabelaf">
                    <thead>
                        <tr>
                            <th>Fornecedores</th>
                            <th style="text-align:right"><a data-toggle="modal" data-target="#myModalAdd" title="Adicionar Novo Fornecedor" class="btn btn-info"><i class="fa fa-plus"></i></a></th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach (var item in Model.ProdutosFornecedores)
                        {
                            <tr class="tr">
                                <td>@item.FornecedorProduto.Nome</td>
                                <td align="right">
                                    <a class="link-excluir" href="#" data-id="@item.Id" title="Excluir"><i class="fa fa-trash-o fa-lg"></i></a>&nbsp;
                                </td>
                            </tr>
                        }
                    </tbody>
                </table>

I tried to use it, doing this:

 public JsonResult BuscaFornecedor(int id)
{
    var fornecedor_produto = db.ProdutosFornecedores.Where(p => p.ProdutoID == id).ToList();

    return Json(new { Resultado = fornecedor_produto });
}

But it did not work either. In the common MVC I would use JsonRequestBehavior.AllowGet, but in MVC Core it is not possible.

EDIT:

I tried to pass this way too, but the same problem continues:

public ActionResult BuscaFornecedor(int id)
    {
        var fornecedor_produto = db.ProdutosFornecedores.Where(p => p.ProdutoID == id).ToList();

        return new JsonResult(new { Resultado = fornecedor_produto });
    }

ajax json asp.net-core

asked by anonymous 07.08.2018 / 19:47

1 answer

Eloquent does not return the same results as SQL How to align DIVs horizontally without breaking lines?

score 1 · Accepted Answer

It turns out that you are returning a Json and not the html of the table.

Change your code as follows:

function buscaFornecedores(id) {
    var url = "/Produto/BuscaFornecedor";
    $.ajax({
        url: url,
        type: 'GET',
        data: { id: id},
        success: function (data) {
            $("#tabelaf").html(data).promise().done(function () {
                $(".modal").modal('show');
            });
        }
    });
}


[HttpGet]
public ActionResult BuscaFornecedor(int id)
{
    var fornecedor_produto = db.ProdutosFornecedores.Where(p => p.ProdutoID == id).ToList();

    return PartialView("_SuaPartialView", fornecedor_produto);
}

Now it will return html with the information

An alternative with less code to load the information is doing so:

function buscaFornecedores(id) {
    $("#tabelaf").load("/Produto/BuscaFornecedor/" + id, function(){
        $(".modal").modal('show');
    });     
}