Inexorable Inexorable - 22 days ago 9
Javascript Question

Filtering JSON data with JQUERY

I'm having trouble filtering the data using jquery and JSON. I'm trying to remove every object that has the id of "234" or the name of "Alan Ford" as the sender. Because i want to make a messaging system that will be separated by Inbox/outbox, And as the Alan Ford is the person Sending, i need to split them up without tampering with JSON directly.

Here is the code:

$(document).ready(function(){
$.getJSON('public/js/data.json', function(json){
$.each(json.data, function(i, data){
if(data.from.id == "234"){ //if is not working correctly
$("p").remove();
$("h1").remove();
$("h2").remove();
$("hr").remove()}
$("#inbox").append(
'<div class="post">'+
'To: '+data.to.name+''+
''+data.subject+''+
''+data.message_formatted+''+
'added: '+data.date_sent_formatted.formatted+''+
'Sender: '+data.from.name+''+
'<hr />'+
'</div>'
);
});
});

});


And the JSON:

{
"data":[
{
"id":"2146",
"from":{
"id":"234",
"name":"Alan Ford"
},
"to":{
"id":"4949",
"name":"Eric Owens"
},
"type":"1",
"replyto":"0",
"date_sent":"1344359836",
"date_read":"0",
"subject":"test",
"message":"test inbox",
"message_formatted":"test inbox",
"date_sent_formatted":{
"id":1196,
"timestamp":1344297600,
"month":8,
"day":7,
"year":2012,
"week":32,
"dayid":3,
"weekday":"Tue",
"mname":"Aug",
"formatted":"Aug 7, 2012"
},
"date_read_formatted":[

]
},
{
"id":"2048",
"from":{
"id":"234",
"name":"Alan Ford"
},
"to":{
"id":"8110",
"name":"Event"
},
"type":"1",
"replyto":"0",
"date_sent":"1343248577",
"date_read":"0",
"subject":"afd",
"message":"asdfads",
"message_formatted":"asdfads",
"date_sent_formatted":{
"id":1184,
"timestamp":1343260800,
"month":7,
"day":26,
"year":2012,
"week":30,
"dayid":5,
"weekday":"Thu",
"mname":"Jul",
"formatted":"Jul 26, 2012"
},
"date_read_formatted":[

]
},
{
"id":"2047",
"from":{
"id":"5245",
"name":"Ian Graham"
},
"to":{
"id":"234",
"name":"Alan Ford"
},
"type":"1",
"replyto":"0",
"date_sent":"1343234342",
"date_read":"1343837983",
"subject":"re: This is SP",
"message":"Hi How are you[quote=Alan Ford]This is SP..Thais is SP[\/quote]",
"message_formatted":"Hi How are you",
"date_sent_formatted":{
"id":1183,
"timestamp":1343174400,
"month":7,
"day":25,
"year":2012,
"week":30,
"dayid":4,
"weekday":"Wed",
"mname":"Jul",
"formatted":"Jul 25, 2012"
},
"date_read_formatted":{
"id":1190,
"timestamp":1343779200,
"month":8,
"day":1,
"year":2012,
"week":31,
"dayid":4,
"weekday":"Wed",
"mname":"Aug",
"formatted":"Aug 1, 2012"
}
},
{
"id":"2046",
"from":{
"id":"5245",
"name":"Ian Graham"
},
"to":{
"id":"234",
"name":"Alan Ford"
},
"type":"1",
"replyto":"0",
"date_sent":"1343232908",
"date_read":"1344001216",
"subject":"Hello",
"message":"Hi",
"message_formatted":"Hi",
"date_sent_formatted":{
"id":1183,
"timestamp":1343174400,
"month":7,
"day":25,
"year":2012,
"week":30,
"dayid":4,
"weekday":"Wed",
"mname":"Jul",
"formatted":"Jul 25, 2012"
},
"date_read_formatted":{
"id":1192,
"timestamp":1343952000,
"month":8,
"day":3,
"year":2012,
"week":31,
"dayid":6,
"weekday":"Fri",
"mname":"Aug",
"formatted":"Aug 3, 2012"
}
},
{
"id":"2043",
"from":{
"id":"234",
"name":"Alan Ford"
},
"to":{
"id":"5399",
"name":"Kob Bryant"
},
"type":"1",
"replyto":"0",
"date_sent":"1342560365",
"date_read":"0",
"subject":"asda",
"message":"ASDASDAS",
"message_formatted":"ASDASDAS",
"date_sent_formatted":{
"id":1176,
"timestamp":1342569600,
"month":7,
"day":18,
"year":2012,
"week":29,
"dayid":4,
"weekday":"Wed",
"mname":"Jul",
"formatted":"Jul 18, 2012"
},
"date_read_formatted":[

]
},
{
"id":"2042",
"from":{
"id":"234",
"name":"Alan Ford"
},
"to":{
"id":"5226",
"name":"1341478142_Kareena kapoor"
},
"type":"1",
"replyto":"0",
"date_sent":"1341364262",
"date_read":"0",
"subject":"adaasd",
"message":"asdadadas",
"message_formatted":"asdadadas",
"date_sent_formatted":{
"id":1162,
"timestamp":1341360000,
"month":7,
"day":4,
"year":2012,
"week":27,
"dayid":4,
"weekday":"Wed",
"mname":"Jul",
"formatted":"Jul 4, 2012"
},
"date_read_formatted":[

]
},
{
"id":"2041",
"from":{
"id":"234",
"name":"Alan Ford"
},
"to":{
"id":"5226",
"name":"1341478142_Kareena kapoor"
},
"type":"1",
"replyto":"0",
"date_sent":"1341091202",
"date_read":"0",
"subject":"asdasd",
"message":"asdasfagfsdgsgsgasg",
"message_formatted":"asdasfagfsdgsgsgasg",
"date_sent_formatted":{
"id":1159,
"timestamp":1341100800,
"month":7,
"day":1,
"year":2012,
"week":26,
"dayid":1,
"weekday":"Sun",
"mname":"Jul",
"formatted":"Jul 1, 2012"
},
"date_read_formatted":[

]
},
{
"id":"2040",
"from":{
"id":"234",
"name":"Alan Ford"
},
"to":{
"id":"5226",
"name":"1341478142_Kareena kapoor"
},
"type":"1",
"replyto":"0",
"date_sent":"1341091171",
"date_read":"0",
"subject":"asdad",
"message":"adasdasdada",
"message_formatted":"adasdasdada",
"date_sent_formatted":{
"id":1159,
"timestamp":1341100800,
"month":7,
"day":1,
"year":2012,
"week":26,
"dayid":1,
"weekday":"Sun",
"mname":"Jul",
"formatted":"Jul 1, 2012"
},
"date_read_formatted":[

]
},
{
"id":"2039",
"from":{
"id":"234",
"name":"Alan Ford"
},
"to":{
"id":"5226",
"name":"1341478142_Kareena kapoor"
},
"type":"1",
"replyto":"0",
"date_sent":"1341091049",
"date_read":"0",
"subject":"Events",
"message":"Good to hear that.",
"message_formatted":"Good to hear that.",
"date_sent_formatted":{
"id":1159,
"timestamp":1341100800,
"month":7,
"day":1,
"year":2012,
"week":26,
"dayid":1,
"weekday":"Sun",
"mname":"Jul",
"formatted":"Jul 1, 2012"
},
"date_read_formatted":[

]
},
{
"id":"2038",
"from":{
"id":"234",
"name":"Alan Ford"
},
"to":{
"id":"4982",
"name":"Hamza Nadeem"
},
"type":"1",
"replyto":"0",
"date_sent":"1341053992",
"date_read":"0",
"subject":"adfads",
"message":"agsgsggasgasgasas",
"message_formatted":"agsgsggasgasgasas",
"date_sent_formatted":{
"id":1158,
"timestamp":1341014400,
"month":6,
"day":30,
"year":2012,
"week":26,
"dayid":7,
"weekday":"Sat",
"mname":"Jun",
"formatted":"Jun 30, 2012"
},
"date_read_formatted":[

]
},
{
"id":"2037",
"from":{
"id":"234",
"name":"Alan Ford"
},
"to":{
"id":"4949",
"name":"Eric Owens"
},
"type":"1",
"replyto":"0",
"date_sent":"1340985832",
"date_read":"0",
"subject":"test",
"message":"testtest",
"message_formatted":"testtest",
"date_sent_formatted":{
"id":1157,
"timestamp":1340928000,
"month":6,
"day":29,
"year":2012,
"week":26,
"dayid":6,
"weekday":"Fri",
"mname":"Jun",
"formatted":"Jun 29, 2012"
},
"date_read_formatted":[

]
},
{
"id":"2036",
"from":{
"id":"234",
"name":"Alan Ford"
},
"to":{
"id":"5730",
"name":"Mobile Employee"
},
"type":"1",
"replyto":"0",
"date_sent":"1340878624",
"date_read":"0",
"subject":"This is SP",
"message":"This is SP..Thais is SP",
"message_formatted":"This is SP..Thais is SP",
"date_sent_formatted":{
"id":1156,
"timestamp":1340841600,
"month":6,
"day":28,
"year":2012,
"week":26,
"dayid":5,
"weekday":"Thu",
"mname":"Jun",
"formatted":"Jun 28, 2012"
},
"date_read_formatted":[

]
},
{
"id":"2035",
"from":{
"id":"234",
"name":"Alan Ford"
},
"to":{
"id":"5735",
"name":"Fsdfsdghh"
},
"type":"1",
"replyto":"0",
"date_sent":"1340878624",
"date_read":"0",
"subject":"This is SP",
"message":"This is SP..Thais is SP",
"message_formatted":"This is SP..Thais is SP",
"date_sent_formatted":{
"id":1156,
"timestamp":1340841600,
"month":6,
"day":28,
"year":2012,
"week":26,
"dayid":5,
"weekday":"Thu",
"mname":"Jun",
"formatted":"Jun 28, 2012"
},
"date_read_formatted":[

]
},
{
"id":"2034",
"from":{
"id":"234",
"name":"Alan Ford"
},
"to":{
"id":"5743",
"name":"double dots3"
},
"type":"1",
"replyto":"0",
"date_sent":"1340878624",
"date_read":"0",
"subject":"This is SP",
"message":"This is SP..Thais is SP",
"message_formatted":"This is SP..Thais is SP",
"date_sent_formatted":{
"id":1156,
"timestamp":1340841600,
"month":6,
"day":28,
"year":2012,
"week":26,
"dayid":5,
"weekday":"Thu",
"mname":"Jun",
"formatted":"Jun 28, 2012"
},
"date_read_formatted":[

]
},
{
"id":"2033",
"from":{
"id":"234",
"name":"Alan Ford"
},
"to":{
"id":"5742",
"name":"double dots2"
},
"type":"1",
"replyto":"0",
"date_sent":"1340878624",
"date_read":"0",
"subject":"This is SP",
"message":"This is SP..Thais is SP",
"message_formatted":"This is SP..Thais is SP",
"date_sent_formatted":{
"id":1156,
"timestamp":1340841600,
"month":6,
"day":28,
"year":2012,
"week":26,
"dayid":5,
"weekday":"Thu",
"mname":"Jun",
"formatted":"Jun 28, 2012"
},
"date_read_formatted":[

]
},
{
"id":"2032",
"from":{
"id":"234",
"name":"Alan Ford"
},
"to":{
"id":"5734",
"name":"Adalph"
},
"type":"1",
"replyto":"0",
"date_sent":"1340878624",
"date_read":"0",
"subject":"This is SP",
"message":"This is SP..Thais is SP",
"message_formatted":"This is SP..Thais is SP",
"date_sent_formatted":{
"id":1156,
"timestamp":1340841600,
"month":6,
"day":28,
"year":2012,
"week":26,
"dayid":5,
"weekday":"Thu",
"mname":"Jun",
"formatted":"Jun 28, 2012"
},
"date_read_formatted":[

]
},
{
"id":"2031",
"from":{
"id":"234",
"name":"Alan Ford"
},
"to":{
"id":"5731",
"name":"Mobile Scheduler"
},
"type":"1",
"replyto":"0",
"date_sent":"1340878624",
"date_read":"0",
"subject":"This is SP",
"message":"This is SP..Thais is SP",
"message_formatted":"This is SP..Thais is SP",
"date_sent_formatted":{
"id":1156,
"timestamp":1340841600,
"month":6,
"day":28,
"year":2012,
"week":26,
"dayid":5,
"weekday":"Thu",
"mname":"Jun",
"formatted":"Jun 28, 2012"
},
"date_read_formatted":[

]
},
{
"id":"2030",
"from":{
"id":"234",
"name":"Alan Ford"
},
"to":{
"id":"4949",
"name":"Eric Owens"
},
"type":"1",
"replyto":"0",
"date_sent":"1340878624",
"date_read":"0",
"subject":"This is SP",
"message":"This is SP..Thais is SP",
"message_formatted":"This is SP..Thais is SP",
"date_sent_formatted":{
"id":1156,
"timestamp":1340841600,
"month":6,
"day":28,
"year":2012,
"week":26,
"dayid":5,
"weekday":"Thu",
"mname":"Jun",
"formatted":"Jun 28, 2012"
},
"date_read_formatted":[

]
},
{
"id":"2029",
"from":{
"id":"234",
"name":"Alan Ford"
},
"to":{
"id":"5628",
"name":"Test email"
},
"type":"1",
"replyto":"0",
"date_sent":"1340878624",
"date_read":"0",
"subject":"This is SP",
"message":"This is SP..Thais is SP",
"message_formatted":"This is SP..Thais is SP",
"date_sent_formatted":{
"id":1156,
"timestamp":1340841600,
"month":6,
"day":28,
"year":2012,
"week":26,
"dayid":5,
"weekday":"Thu",
"mname":"Jun",
"formatted":"Jun 28, 2012"
},
"date_read_formatted":[

]
},
{
"id":"2028",
"from":{
"id":"234",
"name":"Alan Ford"
},
"to":{
"id":"5627",
"name":"1341059685_dejan email test"
},
"type":"1",
"replyto":"0",
"date_sent":"1340878624",
"date_read":"0",
"subject":"This is SP",
"message":"This is SP..Thais is SP",
"message_formatted":"This is SP..Thais is SP",
"date_sent_formatted":{
"id":1156,
"timestamp":1340841600,
"month":6,
"day":28,
"year":2012,
"week":26,
"dayid":5,
"weekday":"Thu",
"mname":"Jun",
"formatted":"Jun 28, 2012"
},
"date_read_formatted":[

]
},
{
"id":"2027",
"from":{
"id":"234",
"name":"Alan Ford"
},
"to":{
"id":"5625",
"name":"Test"
},
"type":"1",
"replyto":"0",
"date_sent":"1340878624",
"date_read":"0",
"subject":"This is SP",
"message":"This is SP..Thais is SP",
"message_formatted":"This is SP..Thais is SP",
"date_sent_formatted":{
"id":1156,
"timestamp":1340841600,
"month":6,
"day":28,
"year":2012,
"week":26,
"dayid":5,
"weekday":"Thu",
"mname":"Jun",
"formatted":"Jun 28, 2012"
},
"date_read_formatted":[

]
},
{
"id":"2026",
"from":{
"id":"234",
"name":"Alan Ford"
},
"to":{
"id":"5623",
"name":"El Homo"
},
"type":"1",
"replyto":"0",
"date_sent":"1340878624",
"date_read":"0",
"subject":"This is SP",
"message":"This is SP..Thais is SP",
"message_formatted":"This is SP..Thais is SP",
"date_sent_formatted":{
"id":1156,
"timestamp":1340841600,
"month":6,
"day":28,
"year":2012,
"week":26,
"dayid":5,
"weekday":"Thu",
"mname":"Jun",
"formatted":"Jun 28, 2012"
},
"date_read_formatted":[

]
},
{
"id":"2025",
"from":{
"id":"234",
"name":"Alan Ford"
},
"to":{
"id":"5618",
"name":"Tiengo Mass"
},
"type":"1",
"replyto":"0",
"date_sent":"1340878624",
"date_read":"0",
"subject":"This is SP",
"message":"This is SP..Thais is SP",
"message_formatted":"This is SP..Thais is SP",
"date_sent_formatted":{
"id":1156,
"timestamp":1340841600,
"month":6,
"day":28,
"year":2012,
"week":26,
"dayid":5,
"weekday":"Thu",
"mname":"Jun",
"formatted":"Jun 28, 2012"
},
"date_read_formatted":[

]
},
{
"id":"2024",
"from":{
"id":"234",
"name":"Alan Ford"
},
"to":{
"id":"5608",
"name":"1344517115_Test22"
},
"type":"1",
"replyto":"0",
"date_sent":"1340878624",
"date_read":"0",
"subject":"This is SP",
"message":"This is SP..Thais is SP",
"message_formatted":"This is SP..Thais is SP",
"date_sent_formatted":{
"id":1156,
"timestamp":1340841600,
"month":6,
"day":28,
"year":2012,
"week":26,
"dayid":5,
"weekday":"Thu",
"mname":"Jun",
"formatted":"Jun 28, 2012"
},
"date_read_formatted":[

]
},
{
"id":"2023",
"from":{
"id":"234",
"name":"Alan Ford"
},
"to":{
"id":"5606",
"name":"1341474388_sgdfgdfg"
},
"type":"1",
"replyto":"0",
"date_sent":"1340878624",
"date_read":"0",
"subject":"This is SP",
"message":"This is SP..Thais is SP",
"message_formatted":"This is SP..Thais is SP",
"date_sent_formatted":{
"id":1156,
"timestamp":1340841600,
"month":6,
"day":28,
"year":2012,
"week":26,
"dayid":5,
"weekday":"Thu",
"mname":"Jun",
"formatted":"Jun 28, 2012"
},
"date_read_formatted":[

]
}
]
}

Answer

I don't get why you'd want to remove anything from the JSON if you need to loop through it anyway to print messages (at least that's what your sample leads me to think).

So I'd just add this condition to your JS:

$.each(json.data, function(i, data){
    if(data.from.id != 234 && data.from.name != 'Alan Ford'){
        $("#inbox").append(
            '<div class="post">'+
            'To: '+data.to.name+''+
            ''+data.subject+''+
            ''+data.message_formatted+''+
            'added: '+data.date_sent_formatted.formatted+''+
            'Sender: '+data.from.name+''+
            '<hr />'+
            '</div>'
        );
    }
});​

Also, you might want to properly escape every variable you're printing by replacing dangerous characters yourself or using the .text() function from jQuery.


Last advice: editing the DOM takes time, so you'd better append only once if you plan on handling a lot of messages:

var output = '';
$.each(json.data, function(i, data){
    if(data.from.id != 234 && data.from.name != 'Alan Ford'){
        output +=
            '<div class="post">'+
            'To: '+data.to.name+''+
            ''+data.subject+''+
            ''+data.message_formatted+''+
            'added: '+data.date_sent_formatted.formatted+''+
            'Sender: '+data.from.name+''+
            '<hr />'+
            '</div>';
    }
});
$("#inbox").append(output);​

Here's the thing: http://jsfiddle.net/pioul/Hy2nd/

Comments