Question

I am working on a PhoneGap iOS Facebook app and I am working on showing the user’s newsfeed. Here is my code so far:

<script>
function showPosts() {
    FB.api('/me/home', function(response) {
        console.log(response);

        if (!response.error) {
            var markup = '';

            var messages = response.data;

            for (var i = 0; i < messages.length && i < 5; i++) {
                var message = messages[i];

                markup += '<p><img src="' + message.picture + '">' + message.message + '<img src="https://graph.facebook.com/' + message.from['id'] + '/picture">' + message.from['name'] + '</p><br>';
            }

           document.getElementById('newsfeedposts').innerHTML = markup;
        }
    });
}
</script>

Right now, if there is no message in a post, “undefined” is displayed. Also, when there is no message picture, there is an empty image icon, because the <img> tag is still being loaded. Would it be possible to create an if statement saying if message.picture is empty than don’t display <img src="message.picture">?

The same goes for the post message. If message.message is empty, could I create an if statement saying don’t display anything if there is no message, eliminating “undefined”?

If an if statement will work, where should I place it? I tried placing an if statement in “markup” but I couldn’t get it to work.

Answer 1

Pretty simple:

if (typeof message.picture != 'undefined') {
  // message.picture is not empty, so do the stuff inside of here.
}