如何显示html表与ajax从json结果对我的看法

本文关键字:json 结果 看法 我的 ajax 表与 何显示 显示 html | 更新日期: 2023-09-27 18:13:15

大家好,我不能在我的视图中添加一个表…我的json结果发送数据ok,但我有问题显示在我的表上…它显示了1毫秒的数据,然后看起来像页面刷新,什么也没显示,我不知道为什么…

On my controller

   [HttpGet] 
    public JsonResult GenerarDetalleInventariobyU(Guid id)
    {
      var result = (from item in bienasignado.GetAll()
                      where item.Ubicacion == id
                      select new
                      {
                          Descripcion = item.Bien.Descripcion,
                          Empleado = item.IdEmpleado
                      }).ToList();
        return Json(result, JsonRequestBehavior.AllowGet);
    }

On my View

function getDetail() {
    var selectedU = $("#UnidadesAdministrativas").val();
    $.ajax({
        cache: false,
        type: "GET",
        url: '@Url.Action("GenerarDetalleInventariobyU", "Inventario")',
        data: { "id": selectedU },
        success: function (data) {
            var tr;
            //Append each row to html table
            for (var i = 0; i < data.length; i++) {
                tr = $('<tr/>');
                tr.append("<td>" + data[i].Descripcion + "</td>");
                tr.append("<td>" + data[i].Empleado + "</td>");
                $('table').append(tr);
            }
        }
    });
    }

请帮忙!

如何显示html表与ajax从json结果对我的看法

另一种方法(可能更简单)是,

  1. 让你的动作返回PartialView的方式,你可以制作你的在.cshtml页面中查看。而不是返回JsonResult,修改它返回PartialView
  2. 显示您的$。ajax调用,将这个部分视图绑定到任何表单元素,如$('#divResults').html(data),其中div results是div (<div id='divResults'></div>)元素的id, data是ajax调用的返回值。

我认为你对成功方法的理解不正确。

success: function (data) {
            var tr;
            //Append each row to html table
            for (var i = 0; i < data.length; i++) {
                tr = $('<tr>'); // remove slash from here
                tr.append("<td>" + data[i].Descripcion + "</td>");
                tr.append("<td>" + data[i].Empleado + "</td>");
                tr.append("<tr/>"); // close it here.
                $('table').append(tr);
            }
        }

请在成功函数中添加以下代码

  $.each(data, function (i, item) {
            $('table').append(
                $('<tr>')
                    .append($('<td>').append(item.Descripcion))
                    .append($('<td>').append(item.Empleado))
            );
            });