Writing jQuery inside a Javascript function not working

Question

I have a js file called example.js which has a line as follows:

gridOptions.api.setRowData(createRowData());

Then there's another file data.js which has the createRowData() function that should return ROW_DATA. It is as follows:

function createRowData() {
    jQuery.getJSON('/file.txt',function(ROW_DATA){

    return ROW_DATA;

    });

}

But, whenever this createRowData() function is called from example.js file, it does not go inside the jQuery block and simply comes to the last curly bracket. Can anyone please tell me what is going wrong here??

What do you mean when you say "it does not go inside the jQuery block and simply comes to the last curly bracket."? — Dream_Cap, Oct 08 '17 at 07:28
I'd try to `exec` ajax call `getJSON` before `setRowData` .. sort of, get the data first, then fill it in grid :) — Kresimir Pendic, Oct 08 '17 at 07:29
@Dream_Cap i.e. it does not go into to execute the statement return ROW_DATA; How do I return this value?? — Xavier, Oct 08 '17 at 07:29
I have no idea what is intended in this code sample, but as it stands, I can see some difficulties. The `gridOptions.api.setRowData(createRowData());` statement appears to use the _result_ of the `createRowData()` function. However, being an Ajax call, there won’t be a result yet, and all you will get is `undefined`, since the function itself doesn’t return anything. If you’re getting nothing, that’s exactly what you’ve called for. — Manngo, Oct 08 '17 at 07:47

kkica · Answer 1 · 2019-01-18T09:42:16.947

You get JSON from the file, pass the result to the callback function, and then return it. Return it where??

As I said, your anonymous function is a callback one.

Program says: When you are done reading from the file, call this function, OK?. While you do that, I am doing something else.

And that is what it does. The program, would go on, until the file is read, when your callback anonymous function would be called. You can do sth like this.

createRowData(gridOptions.api);
// add code here if you want this code to execute even before you get the response
function createRowData(api) {
    jQuery.getJSON('/file.txt',function(ROW_DATA,api){   
    api.setRowData(ROW_DATA);   
    //Whatever else you want to do. In case you want this to be done only 
    //after the values have been read
    });
}

If you want to wait, for the file to be read, just, dont do anything after the function, but put it inside the callback function.

Is there any way to get the data from the file without asynchronous jQuery or Ajax? I don't want the program to go on until the file isn't fully read to a variable and then return the variable. — Xavier, Oct 08 '17 at 07:42

Dream_Cap · Accepted Answer · 2017-10-08T08:27:10.137

2

I believe that you're not getting the value because getJSON is asynchronous as others have said. createRowData is retrieving the value at a later time rather than when it's called.

Here is one way to get the data with promises. I commented what's going on below:

function createRowData() {
    //return a new promise
    return new Promise(function(resolve, reject){

    jQuery.getJSON('/file.txt',function(ROW_DATA){
     //on reject, send an error
     if (ROW_DATA === null) reject("Error fetching data");
    //on resolve, send the row data
    return resolve(ROW_DATA);

    });
});
}
//use then to describe what happens after the ajax request is done
gridOptions.api.setRowData(createRowData()).then(function(rowdata){
return rowdata; //log data or error
})

Edit: to do a synchronous ajax request, you may be able to do something like this, referring to this SO question.

function createRowData() {

    $.ajax({
    url: "/file.txt'",
    async: false,
    success: function(rowdata){
    return rowdata
    }
})

}

To read some data to a variable like you mentioned, nodejs may help because it can handle reading input/output, and probably to a variable as well.:

edited Oct 08 '17 at 08:27

answered Oct 08 '17 at 07:38

Dream_Cap

2,292
2
18
30

Thanks but with this also it is asynchronous and I get undefined in other lines that further use the results. Is there any way to read the file to a javascript variable synchronously? – Xavier Oct 08 '17 at 07:50
I'm getting UncaughtReferenceError: data is not defined. On the line data: data :O – Xavier Oct 08 '17 at 08:09
I removed the line data: data and the error is gone. So, I reaches the line return rowdata and on hovering over it in the Developer Tools, I can see the data also, but it still does return this data from the function createRowData(), i.e., if I try to console.log this data where this createRowData() function is called, it gives "undefined" – Xavier Oct 08 '17 at 08:22
Hmm, I am confused as well now. I removed the data:data. – Dream_Cap Oct 08 '17 at 08:31

Writing jQuery inside a Javascript function not working

2 Answers2