javascript - $.post 用 for in 显示表格

标签 javascript jquery arrays json html-table

我正在尝试显示一个带有 jsonObject 响应的表,使用循环,以 objetosRetorna 开头。Propiedad_Msg 始终不为空,因此表中的行不显示任何内容,只显示显示 error message 的列 我没有使用 AJAX。 这是我的代码。 ....

 $.post("ListaUser.php",
      { 
        IdPost: DatosJson }, 
        function(objetosRetorna){

          for (var i in objetosRetorna){
            if(objetosRetorna.Propiedad_Msg=='Null'){
              $("#tabla tbody").html(""); 
              var nuevaFila=
              "<tr>"
              +"<td><a href='NewUser.php?a=" + objetosRetorna.Prop_id + "'><button type='button' class='btn btn-default light-green lighten-1'>Editar </button></a> <button type='button' onclick='Eliminar("+objetosRetorna.Prop_id+")' class='red lighten-1 btn btn-danger '>Eliminar</button></td>"
              +"<td>"+objetosRetorna[i].Prop_titulo+"</td>"
              +"<td>"+objetosRetorna[i].Prop_propiedad+"</td>"
              +"<td>"+objetosRetorna[i].Prop_categoria+"</td>"
              +"<td>"+objetosRetorna[i].Prop_direccion+"</td>"
              +"<td>"+objetosRetorna[i].Prop_colonia+"</td>"
              +"<td>"+objetosRetorna[i].Prop_coordenadas+"</td>"
              +"<td>"+objetosRetorna[i].Prop_superficie+"</td>"
              +"<td>"+objetosRetorna[i].Prop_recamaras+"</td>"
              +"<td>"+objetosRetorna[i].Prop_imagenes+"</td>"
              +"<td>"+objetosRetorna[i].Prop_precio+"</td>"
              +"<td>"+objetosRetorna[i].Prop_antiguedad+"</td>"
              +"<td>"+objetosRetorna[i].Prop_fecha+"</td>"
              +"<td>"+objetosRetorna[i].Prop_descripcion+"</td>"
              +"<td>"+objetosRetorna[i].Prop_prop_id+"</td>"
              +"</tr>";
              $(nuevaFila).appendTo("#tabla tbody");
            }
            if (objetosRetorna.Propiedad_Msg!="Null") {
              var nuevaFila =
              "<tr>"
              +"<td colspan='5'><center><font color='red'>"+objetosRetorna.Propiedad_Msg+"</font></center></td>"
              +"</tr>";
              $(nuevaFila).appendTo("#tabla tbody");
            }
          }

        },"json");

Json Response

 [{"Prop_id":"32",
    "Prop_titulo":"Mi titulo de propiedad",
    "Prop_propiedad":"Casa",
    "Prop_categoria":"Renta",
    "Prop_direccion":"Calle Term",
    "Prop_colonia":"Progreso",
    "Prop_coordenadas":"499965",
    "Prop_superficie":"40m2",
    "Prop_recamaras":"5",
    "Prop_imagenes":"imagenes",
    "Prop_precio":"4500","Prop_antiguedad":"15 a\u00f1os","Prop_fecha":"0000-00-00",
    "Prop_descripcion":"Departamen","Prop_prop_id":"10",
    "Propiedad_Msg":"Null"}....]

谢谢。 希望有人能帮助我

UPDATE.... TypeError: objetosRetorna.map is not a function[Saber más]index.php:62:30

function(objetosRetorna) {

              var rows = objetosRetorna.map (function(objeto){

              if (objeto.Propiedad_Msg == 'Null') {
            return "<tr>" +
              "<td><a href='NewUser.php?a=" + objeto.Prop_id + "'><button type='button' class='btn btn-default light-green lighten-1'>Editar </button></a> <button type='button' onclick='Eliminar("+objeto.Prop_id+")' class='red lighten-1 btn btn-danger '>Eliminar</button></td>"+
              "<td>"+objeto.Prop_titulo+"</td>"+
              "<td>"+objeto.Prop_propiedad+"</td>"+
              "<td>"+objeto.Prop_categoria+"</td>"+
              "<td>"+objeto.Prop_direccion+"</td>"+
              "<td>"+objeto.Prop_colonia+"</td>"+
              "<td>"+objeto.Prop_coordenadas+"</td>"+
              "<td>"+objeto.Prop_superficie+"</td>"+
              "<td>"+objeto.Prop_recamaras+"</td>"+
              "<td>"+objeto.Prop_imagenes+"</td>"+
              "<td>"+objeto.Prop_precio+"</td>"+
              "<td>"+objeto.Prop_antiguedad+"</td>"+
              "<td>"+objeto.Prop_fecha+"</td>"+
              "<td>"+objeto.Prop_descripcion+"</td>"+
              "<td>"+objeto.Prop_prop_id+"</td>"+
              "</tr>";

            } 
            return "<tr>" +
              "<td colspan='5'><center><font color='red'>"+objeto.Propiedad_Msg+"</font></center></td>"+
              "</tr>";

            });

        $("#tabla tbody").html(rows.join(""));
       }
    );

最佳答案

Objects, {}, 在JavaScript中没有方法.map(),它只适用于Arrays, [].

因此,为了让您的代码正常工作,请将 data.map() 更改为 data.props.map()

以及对类似内容的 json 响应

{"props":[
{"Prop_id":"32"},
{"Prop_titulo":"Mi titulo de propiedad"},
{"Prop_propiedad":"Casa"}, 
{"Prop_categoria":"Renta"}, 
{"Prop_direccion":"Calle Term"},
 ...]}

阅读 .map() 的内容: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map

附言。如果你只想迭代 json 并且你可以将你的 Prop 放入数组中,你可以像这样迭代对象:

for (var key in objetosRetorna) {
  if (objetosRetorna.hasOwnProperty(key)) {
    console.log(key + " -> " + p[key]);
  }
}

如果您需要更深入的修复或解释,请发表评论。

关于javascript - $.post 用 for in 显示表格,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38912265/

相关文章:

javascript - 超时/间隔是基于 CPU 还是浏览器?

javascript 在 document.nameofformtosubmit.submit() 中使用变量值

javascript - 尝试为网站实现 Google 登录,但未显示该按钮

java - 如何循环 nextInt 来定义数组中的变量?

javascript - 为什么我的 Bootstrap 模态窗口在 Opera 中不起作用?

javascript - Sweetalert AJAX 失败

java - 使用 jquery 更改菜单的背景颜色

当托管在 UpdatePanel 中的控件上时,Jquery Colorbox 在关闭后不显示

javascript - WSO2 内带有 Js 的 For 循环 - id 未定义

python - 查找一个 ndarray 中落入另一个 ndarray 内的点