将json字符串显示到表中

时间:2018-02-14 11:10:40

标签: jquery ajax codeigniter-3

我从服务器获取以下JSON字符串作为响应

{"json":[{"title":"Example Title 1","description":"Morbi leo risus, porta ac consectetur ac"},{"title":"Example Title 2","description":"Morbi leo risus, porta ac consectetur ac"}]}

这是我的代码

<script>
  $("#getdata").on('click',function () {
  var form_data={       
                    agent_name: $('#agent_name').val(),
                    number: $('#number').val(),
                    quantity: $('#quantity').val(),
                    date: $('#date').val(),
                    commision: $('#commision').val(),
                    profit: $('#profit').val(),
                    agent_amount: $('#agent_amount').val(),
                    user_id: $('#user_id').val(),
                    type: name_type.val(),
                  }

    $.ajax({
    type: 'POST',
    url: '<?php echo base_url();?>admin_control/ajax_data',
    data: form_data,
    dataType:"json", //to parse string into JSON object,
    success: function(data){ 
        if(data){
            var len = data.length;
            alert(len);
            var txt = "";
            if(len > 0){
                for(var i=0;i<len;i++){
                    if(data[i].number && data[i].type){
                        txt += $('#table').append('<tr><td>data[i].type</td><td>data[i].number</td><td>data[i].quantity</td><td>data[i].amount</td><td><input type="checkbox" class="add_checkbox" name="layout" id="add_checkbox" value="1" checked></td></tr>');

                    }
                }
                if(txt != ""){

                    $("#table").append(txt).removeClass("hidden");
                }
            }
        }
    },
    error: function(jqXHR, textStatus, errorThrown){
        alert('error: ' + textStatus + ': ' + errorThrown);
    }
});
return false;
 });
</script>  

现在我想将结果映射到我的表格,这样做会在使用数据长度的警告时收到类似undefined的错误

2 个答案:

答案 0 :(得分:1)

对于您可以使用的对象大小

Object.keys(data).length;

以下是您在示例

中给出的特定对象的代码

&#13;
&#13;
var data = {"json":[
	{"title":"Example Title 1","description":"Morbi leo risus, porta ac consectetur ac"},
  {"title":"Example Title 2","description":"Morbi leo risus, porta ac consectetur ac"}
]};

var fragment = '';

console.log('object length:', Object.keys(data).length);
console.log('array length', data.json.length)

for(var i=0; i < data.json.length; i++){
	fragment += '<tr><td>'+ data.json[i].title +'</td><td>'+ data.json[i].description +'</td></tr>'; 
}
document.getElementsByTagName('table')[0].innerHTML = fragment;
&#13;
<table></table>
&#13;
&#13;
&#13;

答案 1 :(得分:0)

首先,您必须将数据解析为JSON,然后对其进行操作。

var data = JSON.parse(data);
console.log(data.length);