Function scope within IF Statement

Question

Hi guys, hoping some one can shed some light on my problem. Basicly I only want to execute a block of code if a certain DOM element exists. If it does I then perform a few bits and bobs and then call a function. However it complains that the function is not defined, suggesting that the function is not in scope. Below is the code :

$(document).ready(function ()  
        {   
        if ((document.getElementById("view<portlet:namespace/>:editSplash")!= null)) {
        console.log("notifications scripted started");  

        // hide loading box/ notify on body load  
        $('.ajaxErrorBox').hide();
        $('.loadingNotifications').hide();
        $('.notifyWindow').hide();
        getFeed();

        // set up refresh button for reloading feed
        $('.refreshFeed').click(function() {
        $('.notifyWindow').hide();
        $('.notifyWindow').empty();
        console.log("notifications clicked");
        getFeed(); 
        });

    // begin ajax call using jquery ajax object 

    function getFeed ()
    {
    $('.notifyWindow').empty();  
    console.log("ajax call for feed starting");
        $.ajax ({
        type: "GET",
        url: "http://cw-pdevprt-05.tm-gnet.com:10040/notificationsweb/feed?username=uid=&lt;%@ taglib uri="/WEB-INF/tld/engine.tld" prefix="wps" %><wps:user attribute="uid"/>",
        dataType: "text/xml",
        timeout: 10000,
        success: parseXml       
        });
        };

        // show loading box on start of ajax call

        $('.notifyWindow').ajaxStart(function() {
        $('.refreshFeed').hide("fast");
        $('.notifyWindow').hide();
        $('.ajaxErrorBox').hide();
        $('.loadingNotifications').show("fast");

        });

        // hide loading box after ajax call has stopped

        $('.notifyWindow').ajaxStop(function() {
        $('.loadingNotifications').hide("slow");
        $('.refreshFeed').show("fast"); 

        });

        $('.notifyWindow').ajaxError(function() {
        $('.loadingNotifications').hide("slow");
        $('.ajaxErrorBox').show("fast");
        $('.refreshFeed').show("fast"); 
        });  

    // parse the feed/ xml file and append results to notifications div

    function parseXml (xml) {
        console.log("xml parsing begining");        
        if (jQuery.browser.msie)
        {
            var xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
            xmlDoc.loadXML(xml);
            xml = xmlDoc;
        }


    $(xml).find("entry").each(function()
    {

    var $item = $(this);
    var title = $item.find("title").text();
    var linkN = $item.find("link").attr("href");
    var output = "<a href='" + linkN + "' target='_self'>" + title + "</a><br />";
    $(".notifyWindow").append($(output)).show();

    });
    }



        }
else {
    console.log("notifications not available");
    return false;
}

}); 

If the DOM element exists I then try and call the getFeed function "getFeed();" however it comes back undefined. If anyone could shed some light on this it would be greatly appreciated.

Thanks in advance

Answer 1

Problem solved - I moved my functions outside of the if statement. We live and learn lol :-)

Answer 2

It seems that you're calling getFeed before it is defined. Try moving the if statement to after the function definition. Note that this behaviour is actually implementation specific, so some browsers may work this way and some may not.

Oh - And seriously? view<portlet:namespace/>:editSplash for an id?