Problem with Global Vars and callBackFunction

Hi there,

I've got your service working nicely except...it won't do what I want it too...

my code is simple enough and is shown below:

Summary

Global Vars messageResource.init messageResource.load //get two messages into global vars open a popup using global vars

The code works and the messages are loaded in messageResource.load and can be seen in console.log

BUT when i try to use the global vars in the popup they are empty!!! So why is this happening?

Then I thought, OK I will try moving the popup code to /* 1 */

but then I get a message ...

Uncaught TypeError: Cannot read property 'document' of undefined

How can I use your routine to accomplish what I want, it seems ideal but...

I've also move the callBackFunction from inline to where the popup code is but I don't understand these things.

I assume this is my problem...but how do I get it too work???

Many thanks and best regards Seán

var propertiesFileName = "propertiesFILE";
var myCompanyDingBatDesc;
var myCompanyDingBatPurp;

function dirtypopup03(DingBat) {

    var module = "dirtypopup03 ";
    var debug = true;

    if (debug == true) { console.log(module + "v01.01"); }
    if (debug == true) { console.log(module + "Arriving"); }

    // initialize messageResource.js with settings
    messageResource.init({
        // path to directory containing message resource files(.properties files),
        // give empty string or discard this configuration if files are in the same directory as that of html file.
        filePath: '../../myCompany/properties'
    });
    console.log(module + "After filePath");

    // will load the file 'path/messageresource/moduleName.properties'
    // and callbackFunction will be executed when loading is complete.

    messageResource.load(propertiesFileName, function () {

        // load file callback 
        // get value corresponding  to a key from config.properties  

        if (debug == true) { console.log(module + "Before Getting Key"); }
        myCompanyTxt = messageResource.get('sample.key', propertiesFileName);
        if (debug == true) { console.log(module + "myCompanyTxt = " + myCompanyTxt); }
        if (debug == true) { console.log(module + "After Getting Key"); }

        if (debug == true) { console.log(module + "Before Getting My Keys"); }
        var DingBatDesc = 'myCompany.' + DingBat + 'DingBat-003';
        var DingBatPurp = 'myCompany.' + DingBat + 'DingBat-004';

        if (debug == true) { console.log(module + DingBatDesc); }
        if (debug == true) { console.log(module + DingBatPurp); }

        if (debug == true) { console.log(module + "After Setting My Keys"); }

        myCompanyDingBatDesc = messageResource.get(DingBatDesc, propertiesFileName);
        myCompanyDingBatPurp = messageResource.get(DingBatPurp, propertiesFileName);

        if (debug == true) { console.log(module + "myCompanyDingBatDesc = " + myCompanyDingBatDesc); }
        if (debug == true) { console.log(module + "myCompanyDingBatPurp = " + myCompanyDingBatPurp); }
        if (debug == true) { console.log(module + "After Getting My Keys"); }

        if (debug == true) { console.log(module + "Leaving"); }

/* 1 */

    });

// popup code
    var generator = window.open('', DingBat, 'height=700,width=500');

    generator.document.write('<html><head><title>DingBat Details</title>');
    generator.document.write('<link rel="stylesheet" href="style.css">');
    generator.document.write('</head><body>');
    generator.document.write('<p></p>');
    generator.document.write('<p><b>' + 'DingBat:</b> ' + DingBat + '</p>');
    generator.document.write('<p><b>' + 'DingBat Desc:' + '</b></p>');
    generator.document.write('<p>' + myCompanyDingBatDesc + '</p>');
    generator.document.write('<p><b>' + 'DingBat Purp:' + '</b></p>');
    generator.document.write('<p>' + myCompanyDingBatPurp + '</p>');
    generator.document.write('<p>DingBat is ' + DingBat + '</p>');
    generator.document.write('<p><a href="javascript:self.close()">Close</a> this window.</p>');
    generator.document.write('</body></html>');

    generator.document.close();

}

You should move popup code to / 1 / , otherwise it won't work.

Uncaught TypeError: Cannot read property 'document' of undefined The above error occurs because the variable generator might not have been initialized correctly. You should try debugging your code with firebug or a similar tool.

Hi Suhaib,

Actually I tried that, and that is when I get the error Uncaught Type Error. For some reason it does not work in your function code.

The pop up code works perfectly where it is but there is no data from the function, but when I add it to the function that's when I get the error... There is nothing wrong with var generator that I can see. I debug using chrome debugger, I don't know firebug.

Regards, Seán

OK I've done some more testing...as follows

test 1 Global Var defined OK msg defined OK

popup window OK
init, OK
Load (callback(){
    get msg OK}
)
load into global var - failed. msg has disappeared

test 2 init OK load (callback() { define Var OK get msg OK Var.document // error - Uncaught TypeError: Cannot read property 'document' of undefined } )

While I'm a relative noobie to javascript and do not understand it all, I cannot figure out why it will not work . The Var for some reason cannot be used as a document object within the callback function. Any ideas?

It would be so mach easier (for me) if it was as easy as (1)...

messageResource.init();
messageResource.load();
myData1 = messageResource.get(key1);  //notice - not inside the load
myData2 = messageResource.get(key2);
mypopUp = mydata1+mydata2;

currently the code is(2):

messageResource.init();
messageResource.load( function() {
    myData1 = messageResource.get(key1);  //notice - inside the load
    myData2 = messageResource.get(key2);
    mypopUp = mydata1+mydata2;
    }
    )

But this fails making the routine basically useless as the data is stuck inside the function and cannot be used outside.

So two questions:

1) can we get it to work as (1) above so the key retrieval is not inside the load, 2) how do we get the data outside the callbackFunction? 3) why does var mypopup not get correctly assigned when in the callback function?

I have read that

var generator = window.open('', process, 'height=700,width=500');
generator.document.write('<html><head><title>Process Details</title>');

can fail with the above error if popups are disabled...(I have popups enabled)...

BUT

this code works...

var generator = window.open('', process, 'height=700,width=500');
generator.document.write('<html><head><title>Process Details</title>'); etc
messageResource.init();
messageResource.load();

and this doesn't

messageResource.init();
messageResource.load(
    function(){
        var generator = window.open('', process, 'height=700,width=500');
        generator.document.write('<html><head><title>Process Details</title>'); etc
    }

);

Why does the function code not work when the previous one does? It's obvious that popups are working as seen in the previous example...

I believe this is an excellent tool and would be great for popups if it could be used...but at the moment it fails...unfortunately.

Thanks and regards Seán

Hi Sean,

index.html

<html>
    <head>
        <title>Test Popup</title>
    </head>
    <body>
        <input type="button" value="Show Popup" onclick="showPopup()" />
        <script src="messageResource.js"></script>
        <script src="main.js"></script>
    </body>
</html>

main.js


var firstValue, secondValue; 

function showPopup(){
    messageResource.init({
        debugMode : true
    });
    messageResource.load('test', function(){
        firstValue = messageResource.get('first', 'test');
        secondValue = messageResource.get('second', 'test');

        var generator = window.open('', 'Popup Window', 'height=700,width=500');
        generator.document.write('<html><head><title>Popup</title>');
        generator.document.write('</head><body>');
        generator.document.write('<p>' + firstValue + '</p>');
        generator.document.write('<p>' + secondValue + '</p>');
        generator.document.write('</body></html>');
        generator.document.close();
    });
}

I tested the above code and its working for me, also i didn't get any error while opening a popup inside callback.

suhaibkhan / messageResource.js

Problem with Global Vars and callBackFunction #5

Summary

BUT