i have this json response
[[{"id":73,"entry_by":"5","post":"Prova","location":"","images":"","tagged_friends":0,"created_at":"2016-08-05
07:17:14","updated_at":"2016-08-05 07:17:14","post_type":0,"comments_open":0,"is_blocked":0,"is_share" :0,"video":"","book_id":0,"author_id":0},{"id":72,"entry_by":"5","post":"Prova","location":"","images" :"","tagged_friends":0,"created_at":"2016-08-05 06:59:18","updated_at":"2016-08-05 06:59:18","post_type" :0,"comments_open":0,"is_blocked":0,"is_share":0,"video":"","book_id":0,"author_id":0},{"id":71,"entry_by" :"5","post":"Prova","location":"","images":"","tagged_friends":0,"created_at":"2016-08-05 06:59:12","updated_at" :"2016-08-05 06:59:12","post_type":0,"comments_open":0,"is_blocked":0,"is_share":0,"video":"","book_id" :0,"author_id":0},{"id":70,"entry_by":"5","post":"Prova","location":"","images":"","tagged_friends":0 ,"created_at":"2016-08-05 06:59:08","updated_at":"2016-08-05 06:59:08","post_type":0,"comments_open" :0,"is_blocked":0,"is_share":0,"video":"","book_id":0,"author_id":0},{"id":69,"entry_by":"5","post":"Prova" ,"location":"","images":"","tagged_friends":0,"created_at":"2016-08-05 06:59:04","updated_at":"2016-08-05 06:59:04","post_type":0,"comments_open":0,"is_blocked":0,"is_share":0,"video":"","book_id":0,"author_id" :0},{"id":68,"entry_by":"5","post":"Prova","location":"","images":"","tagged_friends":0,"created_at" :"2016-08-05 06:58:58","updated_at":"2016-08-05 06:58:58","post_type":0,"comments_open":0,"is_blocked" :0,"is_share":0,"video":"","book_id":0,"author_id":0},{"id":67,"entry_by":"5","post":"Prova","location" :"","images":"","tagged_friends":0,"created_at":"2016-08-05 06:58:51","updated_at":"2016-08-05 06:58 :51","post_type":0,"comments_open":0,"is_blocked":0,"is_share":0,"video":"","book_id":0,"author_id":0 },{"id":66,"entry_by":"5","post":"Prova","location":"","images":"","tagged_friends":0,"created_at":"2016-08-05 06:56:58","updated_at":"2016-08-05 06:56:58","post_type":0,"comments_open":0,"is_blocked":0,"is_share" :0,"video":"","book_id":0,"author_id":0},{"id":65,"entry_by":"5","post":"Prova","location":"","images" :"","tagged_friends":0,"created_at":"2016-08-05 06:56:52","updated_at":"2016-08-05 06:56:52","post_type" :0,"comments_open":0,"is_blocked":0,"is_share":0,"video":"","book_id":0,"author_id":0},{"id":64,"entry_by" :"5","post":"MInkia","location":"","images":"","tagged_friends":0,"created_at":"2016-08-05 06:41:59" ,"updated_at":"2016-08-05 06:41:59","post_type":0,"comments_open":0,"is_blocked":0,"is_share":0,"video" :"","book_id":0,"author_id":0},{"id":63,"entry_by":"5","post":"MInkia","location":"","images":"","tagged_friends" :0,"created_at":"2016-08-05 06:41:51","updated_at":"2016-08-05 06:41:51","post_type":0,"comments_open" :0,"is_blocked":0,"is_share":0,"video":"","book_id":0,"author_id":0},{"id":74,"entry_by":"5","post":"Prova" ,"location":"","images":"","tagged_friends":0,"created_at":"2016-08-05 07:17:32","updated_at":"2016-08-05 07:17:32","post_type":0,"comments_open":0,"is_blocked":0,"is_share":0,"video":"","book_id":0,"author_id" :0},{"id":75,"entry_by":"5","post":"Prova","location":"","images":"","tagged_friends":0,"created_at" :"2016-08-05 07:18:28","updated_at":"2016-08-05 07:18:28","post_type":0,"comments_open":0,"is_blocked" :0,"is_share":0,"video":"","book_id":0,"author_id":0}]]
i want to create a live feed masonry that show this result but in AJAX i fetch only the first result. This is Ajax (at the moment there is not output from Json i need only to get on div appended foreach result)
<script type="text/javascript">
$(document).ready(function(){
$.ajax({
url:"getposts",
type: "get",
data: "{}",
success: function(data){
var res = data;
$.each(res, function(index, value) {
$('#prova').append($('<div class="timeline-block">\
<div class="panel panel-default">\
<div class="panel-heading">\
<div class="media">\
<div class="media-left">\
<a href="">\
<img src="http://ift.tt/2aDbfvn" width="50px" class="media-object">\
</a>\
</div>\
<div class="media-body">\
<a href="#" class="pull-right text-muted"><i class="icon-reply-all-fill fa fa-2x "></i></a>\
<a href="">Paolo</a>\
<span>1/08/2016</span>\
</div>\
</div>\
</div>\
<div class="panel-body">\
<p>Prova</p>\
</div>\
<div class="view-all-comments">\
<a href="#">\
<i class="fa fa-comments-o"></i> View all</a>\
<span>10 comments</span>\
</div>\
<ul class="comments">\
<li class="media">\
<div class="media-left">\
<a href="">\
<img src="http://ift.tt/2aqVW5y" class="media-object"></a>\
</div>\
<div class="media-body">\
<div class="pull-right dropdown" data-show-hover="li">\
<a href="#" data-toggle="dropdown" class="toggle-button">\
<i class="fa fa-pencil"></i>\
</a>\
<ul class="dropdown-menu" role="menu">\
<li><a href="#">Edit</a></li>\
<li><a href="#">Delete</a></li>\
</ul>\
</div>\
<a href="" class="comment-author pull-left">Bill D.</a>\
<span>Hi Mary, Nice Party</span>\
<div class="comment-date">21st September</div>\
</div>\
</li>\
<li class="media">\
<div class="media-left">\
<a href="">\
<img src="http://ift.tt/2aDb8zF" class="media-object">\
</a>\
</div>\
<div class="media-body">\
<div class="pull-right dropdown" data-show-hover="li">\
<a href="#" data-toggle="dropdown" class="toggle-button">\
<i class="fa fa-pencil"></i>\
</a>\
<ul class="dropdown-menu" role="menu">\
<li><a href="#">Edit</a></li>\
<li><a href="#">Delete</a></li>\
</ul>\
</div>\
<a href="" class="comment-author pull-left">Mary</a>\
<span>Thanks Bill</span>\
<div class="comment-date">2 days</div>\
</div>\
</li>\
<li class="media">\
<div class="media-left">\
<a href="">\
<img src="http://ift.tt/2aqVW5y" class="media-object"></a>\
</div>\
<div class="media-body">\
<div class="pull-right dropdown" data-show-hover="li">\
<a href="#" data-toggle="dropdown" class="toggle-button">\
<i class="fa fa-pencil"></i>\
</a>\
<ul class="dropdown-menu" role="menu">\
<li><a href="#">Edit</a></li>\
<li><a href="#">Delete</a></li>\
</ul>\
</div>\
<a href="" class="comment-author pull-left">Bill D.</a>\
<span>What time did it finish?</span>\
<div class="comment-date">14 min</div>\
</div>\
</li>\
<li class="comment-form">\
<div class="input-group">\
<span class="input-group-btn">\
<a href="" class="btn btn-default"><i class="fa fa-photo"></i></a>\
</span>\
<input type="text" class="form-control" />\
</div>\
</li>\
</ul>\
</div>\
</div>'));
});
}
});
via Chebli Mohamed
Aucun commentaire:
Enregistrer un commentaire