Getting first image result from flickr

Question

I have the typical example to get the first image from flickr. I call this script from a html. I use Javascript to get a value from a database, and I send that value to the html with this sentence, so it can be shown.

document.getElementById("winner").innerHTML=output1;

This is the code that I use to get the first image:

<script>
    (function() {
        var flickerAPI = "http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?";
        $.getJSON( flickerAPI, {
            tags: "clint eastwood",
            tagmode: "any",
            format: "json"
        })
        .done(function( data ) {
            $.each( data.items, function( i, item ) {
                $( "<img/>" ).attr( "src", item.media.m ).appendTo( "#image" );
                if ( i === 0 ) {
                    return false;
                }
            });
        });
    })();
</script>

How can I pass to this script the value that I have received from the database, so I can search for that tag in Flickr?

Thanks.

Answer 1

You just need to grab the HTML you have stored in #winner adn pass it to the flicker API

var tags = document.getElementById("winner").innerHTML;
var flickerAPI = "http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?";
    $.getJSON( flickerAPI, {
        tags: tags,
        tagmode: "any",
        format: "json"
    })

the HTML is stored in var tags and passed in the getJSON call

However if your DB call is in the same scope as your flicker call you should be able to just store and pass output1 and save the extra DOM read