object literal undefined

Question

Q.js file

Q = {};

Q.stringFile = [];
Q.file = "CSS.txt";

Q.getData = function(Q.file){
    $.get(Q.file, function(data){
        var str = data;
        Q.stringFile = str.split("\n"); 

        return Q.stringFile;
    });
}

a.html file

<head>
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.6.1.min.js"></script>   
    <script type="text/javascript" src="Q.js"></script>
    <script type="text/javascript">
        var d = Q.getData(Q.file);
        alert(d);
     </script>

</head>

<body>

</body>
</html>

alert doesn't output!

Errors: Q is not defined ; unexpected token .

How do i fix this??

possible duplicate of [jQuery: Return data after ajax call success](http://stackoverflow.com/questions/5316697/jquery-return-data-after-ajax-call-success) — Felix Kling, Jun 03 '11 at 10:29
why not?? and why Q is undefined?? it seems as if html doesnt see Q object... — DrStrangeLove, Jun 03 '11 at 10:32
Because the Ajax is call is asynchronous, i.e. the callback will be called loooong time after the outer function `getData` returns. — Felix Kling, Jun 03 '11 at 10:34

Felix Kling · Accepted Answer · 2011-06-03T11:00:16.817

2

As I said in my comment, you cannot return data from an Ajax call, as the Ajax call is asynchronous. You have to make your function accept a callback, like:

Q.getData = function(file, callback){
    $.get(file, function(data){
        var stringFile = data.split("\n"); 
        callback(stringFile);
    });
};

and then call it with:

Q.getData(Q.file, function(d) {
    alert(d);
});

Regarding the errors: You have a syntax error in this line

Q.getData = function(Q.file)

Q.file is not valid here. The browser cannot parse and process the file and so Q will not be defined.

I have the impression, you should first read some tutorial before you go on.

edited Jun 03 '11 at 11:00

answered Jun 03 '11 at 10:36

Felix Kling

795,719
175
1,089
1,143

but why Q is undefined?? html doesnt see Q.js file?? – DrStrangeLove Jun 03 '11 at 10:48
Because of this syntax error. If you remove it, `Q` will be defined. As you have this error, the browser cannot correctly parse the file. – Felix Kling Jun 03 '11 at 10:52
Thanks a lot!! I didn't know about dot formal parameter rule and unreturnable ajax async call.. i learnt now.. thanks!! – DrStrangeLove Jun 03 '11 at 11:09

score 2 · Answer 2 · answered Jun 03 '11 at 10:40

2

Your problem is at:

Q.getData = function(Q.file) {

The part after function( is a formal parameter list and can only contain valid identifiers. They can't contain '.' characters.

answered Jun 03 '11 at 10:40

RobG

142,382
31
172
209

score 1 · Answer 3 · answered Jun 03 '11 at 10:35

I think the problem is with the method definition:

Q.getData = function() {
    var that = this;
    $.get(that.file, function(data){
        var str = data;
        that.stringFile = str.split("\n"); 

        // below return has no purpose in an async request
        // return Q.stringFile;

        alert(that.stringFile);
    });
}

After running Q.getData(); your Q.stringFile will contain your data;

Also because this function does not return any value, you have to put your alert in the callback.

score 1 · Answer 4 · answered Jun 03 '11 at 10:36

1

Your:

Q.getData = function(Q.file) {

Is not valid, that's where you define named arguments not where you pass them.

answered Jun 03 '11 at 10:36

Alex K.

171,639
30
264
288

score 0 · Answer 5 · answered Jun 03 '11 at 11:09

You can't use an object property as function parameter: Q.getData = function(Q.file){. In this case there is no need for a parameter at all because of closure you can read Q.file from inside the getData function.

The reason that your alert is returning undefined is that you are making a asynchronous AJAX call it doesn't return anything so d is undefined. If you want to return something from an AJAX call you need to make a synchronous call.

A better solution however would be to use a success handler:

var Q = {}; // Without the var it is an implied global.  In this case you look like you want a global, but it's still good form to explicitly define it in the global namespace.

Q.stringFile = [];
Q.file = "CSS.txt";

Q.getData = function() {
    $.get(Q.file, function(data) {
        var str = data;
        Q.stringFile = str.split("\n"); 

        return Q.stringFile;
    }).success(function (d) { // This fires once the data has arrived
        alert(d);
    });
}; // you should have a ; here

object literal undefined

5 Answers5