$ .post在

时间:2016-08-12 07:26:45

标签: javascript jquery arrays json html-table

我正在尝试显示一个带有jsonObject响应的表,使用loop for,以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回复

 [{"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不是函数[Sabermá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(""));
       }
    );

2 个答案:

答案 0 :(得分:0)

您需要参考您正在循环的条目。而不是

for (var i in objetosRetorna){
    if(objetosRetorna.Propiedad_Msg=='Null'){

你想要

for (var i in objetosRetorna){
    if(objetosRetorna[i].Propiedad_Msg=='Null'){
    // --------------^^^

您稍后会在objetosRetorna.Prop_id处犯同样的错误。

for-in不是循环播放数组的正确方法。您有lots of options,但在这里我可能会使用forEach

另外,无关,但你有

if (objetosRetorna.Propiedad_Msg == 'Null') {

然后立即

if (objetosRetorna.Propiedad_Msg != 'Null') {

在这种情况下,你可以使用else来避免重复这种情况的维护问题。

在添加每个行时,您还会从表中删除所有内容,这意味着您最终只能使用最后一行。因此,不是forEach,而是使用map来返回行字符串数组:

所以把所有这些放在一起(参见***评论):

$.post("ListaUser.php", {
        IdPost: DatosJson
    },
    function(objetosRetorna) {
        // *** Note use of `map` to get a string for each row
        var rows = objetosRetorna.map(function(objecto) { // *** We receive each entry as the `objecto` argument
            // Use `objeto` for the various things below
            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>" + objetos.Prop_titulo + "</td>" +
                    "<td>" + objetos.Prop_propiedad + "</td>" +
                    "<td>" + objetos.Prop_categoria + "</td>" +
                    "<td>" + objetos.Prop_direccion + "</td>" +
                    "<td>" + objetos.Prop_colonia + "</td>" +
                    "<td>" + objetos.Prop_coordenadas + "</td>" +
                    "<td>" + objetos.Prop_superficie + "</td>" +
                    "<td>" + objetos.Prop_recamaras + "</td>" +
                    "<td>" + objetos.Prop_imagenes + "</td>" +
                    "<td>" + objetos.Prop_precio + "</td>" +
                    "<td>" + objetos.Prop_antiguedad + "</td>" +
                    "<td>" + objetos.Prop_fecha + "</td>" +
                    "<td>" + objetos.Prop_descripcion + "</td>" +
                    "<td>" + objetos.Prop_prop_id + "</td>" +
                    "</tr>";
            }
            // It's not null
            return "<tr>" +
                    "<td colspan='5'><center><font color='red'>" + objeto.Propiedad_Msg + "</font></center></td>" +
                    "</tr>";
        });
        // *** Now we replace the table contents with the strings (joined into one string)
        $("#tabla tbody").html(rows.join(""));
    }
);

答案 1 :(得分:0)

JavaScript中的

对象{}没有方法.map(),它只适用于数组,[]。

因此,为了使您的代码能够将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()on: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map

PS。如果你只想迭代json并且你可以将你的道具变成数组,你可以迭代这样的对象:

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

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