CODEWITHSUNDEEP
jquery
Sachin
Sachin

Reputation: 18777

How to access a jQuery variable outside script?

I am an absolute newbie to jquery. So this might be a very basic question, please bear with me.

I have defined a jQuery function, which creates a 2-d array.

    <script type="text/javascript">
        $(document).ready(function() {
            $.ajax({
                url: '/testdata.txt',
                dataType: 'text',
                success: function(data) {
                    var datatable = [];
                            // Populate datatable[]. This is a 2-d array.
                            $('#myTestDiv').text(datatable[2][0]);
                        },
                        error: function(){
                            alert('error!');
                        }
                    })
                });
    </script>

<body>
    <table>
        <thead>
        </thead>
    </table>
</body>

Now, I want to print the 2-d array, "datatable", in the HTML table, preferably with JSTL. But it appears that the "datatable" variable is not accessible outside . I know that the table is being populated correctly, the $('#myTestDiv').text(datatable[2][0]); is printing expected output.

How to achieve this?

Thanks a lot.

Upvotes: 1

Views: 1745

Answers (4)

RET
RET

Reputation: 9188

I suggest you should declare the datatable variable outside the .ajax() function so that it is visible in other parts of the code.

If you know it's being populated correctly, then it's just a scoping problem.

UPDATE

        $(document).ready(function() {
            var datatable = [];
            $.ajax({
                url: '/testdata.txt',
                dataType: 'text',
                success: function(data) {
                    var lines = data.split('\n');
                    $.each(lines, function(i, val) { 
                        datatable[i] = [];
                    });
                    $.each(lines, function(j, val) { 
                        datatable[j] = lines[j].split(',');
                    });
                    $('#myTestDiv').text(datatable[2][1]);
                },
                error: function(){
                    alert('error!');
                }
            })
        });

Upvotes: 0

Ahamed Mustafa M
Ahamed Mustafa M

Reputation: 3139

I dont think that you can access the datatable variable in JSTL. JSTL's role or action will be at the server side whereas the datatable is a client side javascript variable. What you can try is, assign this datatable value to a hidden bean property with $('elementId').val(datatable) and then access it at the server side in further requests to server

Upvotes: 0

jfriend00
jfriend00

Reputation: 708206

You could make datatable be a global variable so it's available anywhere, but that usually isn't what really makes a correct implementation because the rest of your code doesn't know when the data is in that variable. The ajax function is asynchronous so you can't just assume the data is in datatable after your ajax function runs. In fact, it won't actually be available until some time later when the success handler is called.

Instead, a typical implementation is to call a function from your success function and pass it the datatable variable as an argument. This solves both the timing (of the asynchronous ajax call) issue and the availability of the data issue (passed as an argument to a function). That would look like this:

            success: function(data) {
                var datatable = [];
                // Populate datatable[]. This is a 2-d array.
                // call function to process the data
                processData(datatable);

            },

Upvotes: 0

Sampson
Sampson

Reputation: 268512

Remove var from in front of the variable declaration. This will result in the variable being placed on the global window object, making it accessible from all over. Be careful with this type of practice though, as polluting your global context is frowned upon.

Upvotes: 2

Related Questions